Difference between #4 and #5 of How to create nice modal login widget with a CJuiDialog

unchanged
Title
How to create nice modal login widget with a CJuiDialog
unchanged
Category
Tutorials
unchanged
Tags
user, login, modal, widget
changed
Content
##Components
...folder   /protected/components/UserLoginWidget.php...
...extending the CWidget class...

You have to extend the widget class and configure it for user login widget

~~~
[php]
class UserLoginWidget extends CWidget
{
    public $title='User login';
    
    public $visible=true; 
  
 
    public function init()
    {
        if($this->visible)
        {
       
        }
    }
 
    public function run()
    {
        if($this->visible)
        {
            $this->renderContent();
          
        }
    }
 
 
    protected function renderContent()
    {
        $form=new User;
        if(isset($_POST['User']))
        {
            $form->attributes=$_POST['User'];
            if($form->validate() && $form->login()){
                $url = $this->controller->createUrl('user/index');
	 	$this->controller->redirect($url);
	    }
               
                
        }
        $this->render('UserLogin',array('form'=>$form));
    }   
}
~~~

...folder   /protected/components/views/UserLogin.php...

Configuring the view of UserLoginWidget class
~~~
[php]
<?php if(Yii::app()->user->isGuest) : ?>
<?php if($form->getErrors() != null) {
$this->beginWidget('zii.widgets.jui.CJuiDialog', array(
    'id'=>'userloginwidget',
    'cssFile'=>'jquery-ui-1.8.7.custom.css',
    'theme'=>'redmond',
    'themeUrl'=>Yii::app()->request->baseUrl.'/css/ui',
    'options'=>array(
        'title'=>'User Login Errors',
        'autoOpen'=>true,
        'modal'=>true,
        'width'=>350,
    ),
));
}else{
    

$this->beginWidget('zii.widgets.jui.CJuiDialog', array(
    'id'=>'userloginwidget',
    'cssFile'=>'jquery-ui-1.8.7.custom.css',
    'theme'=>'redmond',
    'themeUrl'=>Yii::app()->request->baseUrl.'/css/ui',
    'options'=>array(
        'title'=>'User Login',
        'autoOpen'=>false,
        'modal'=>true,
        'width'=>300,
    ),
));

}
?>

<?php echo CHtml::beginForm(Yii::app()->homeUrl); ?>

<?php echo CHtml::activeLabel($form,'username'); ?>
<br/>
<?php echo CHtml::activeTextField($form,'username') ?>


<?php echo CHtml::activeLabel($form,'password'); ?>
<br/>
<?php echo CHtml::activePasswordField($form,'password') ?>

<?php echo CHtml::activeCheckBox($form,'rememberMe'); ?>
<?php echo CHtml::activeLabel($form,'rememberMe'); ?>
&nbsp;<?php echo CHtml::submitButton('Submit'); ?>


<?php echo CHtml::error($form,'password'); ?>
<?php echo CHtml::error($form,'username'); ?>


<?php echo CHtml::endForm(); ?>
<?php $this->endWidget('zii.widgets.jui.CJuiDialog'); ?>
<?php endif; ?>
~~~

##Layout Config

Calling the widget


~~~
[php]

<?php
$this->widget('zii.widgets.CMenu',array(
'items'=>array(
array('label'=>'User Llogin', 'url'=>'#','linkOptions'=>array(
'onclick'=>'$("#userloginwidget").dialog("open"); return
false;'),'visible'=>Yii::app()->user->isGuest),	
),
)); 





$this->widget('UserLoginWidget',array('visible'=>Yii::app()->user->isGuest));


?>
~~~
##Demo
[In the right top corrner click on PRIJAVA...](http://tvoja4zida.net/ "In
the right top corrner click on PRIJAVA")