Authorization through fancybox at yii

An article on how to screw the fancybox-authorization to the project on yii in the encoding win-1251. If you are a happier developer, and your project is in utf, you can simply skip the clauses related to encoding hell, the rest is the same. Although, perhaps then you will not need this article.

The article assumes that you already have all the classes responsible for authorizing users, and you just need to get them to work through fancybox.


')

We connect fancybox

Download the fancybox extension, put it in the extensions folder.
We connect in the template:

<?php $this->widget('application.extensions.fancybox.EFancyBox', array()); ?> 

Make a link in the template that will be used to call our fancybox:

 <?php echo CHtml::link('', array('/some_controller/fancy/'), array('class'=>'fancy_auth')); ?> 

According to the fancy_auth reference class, we hang the event:

 $(document).ready(function(){ $(".fancy_auth").fancybox({ 'transitionIn' : 'elastic', 'transitionOut' : 'elastic', 'width' : 345, 'height' : 360, 'autoDimensions': false, 'autoSize': false, 'speedIn' : '500', 'speedOut' : '500', 'type' : 'ajax', 'closeBtn' : false }); 

Basically, the parameters are given for example. The only thing worth paying attention to is 'type': 'ajax'. If you make a 'type': 'iframe', the code for processing a successful request that I quote below, namely the page reload code, will not work. If after authorization you do not need a reboot, choose the type at your discretion.

Controller

As can be seen from the link parameters, the view containing the authorization form is given by the fancy controller method some_controller. My method looks like this:

 public function actionFancy() { $model=new UserLogin; $this->performAjaxValidation($model); echo $this->renderPartial('_login_utf',array('model'=>$model),true,true); } 

By default, the value of the last parameter in renderPartial is false. In this case, it is important for us to set it to true, because it is responsible for processing by the processOutput () method, which is called by default in the render method, and includes all the necessary scripts and other dynamic content. Without this, error handling during registration will not work for us.

Pattern and slightly encoding hell

If you are lucky, and you have a project on utf-8, simply create the desired view. For example:

 <?php $form=$this->beginWidget('CActiveForm', array( 'id'=>'user-login', //  ,    'action' => Yii::app()->createUrl('/user/login'), // ajax-  'enableAjaxValidation'=>true, 'clientOptions'=>array( 'validateOnSubmit'=>true, // js ,      ,   . //         'afterValidate' => 'js:afterValidate', ), )); ? <?php echo $form->labelEx($model,'username'); ?> <?php echo $form->textField($model,'username'); ?> <?php echo $form->error($model,'username'); ?> <?php echo $form->labelEx($model,'password'); ?> <?php echo $form->passwordField($model,'password'); ?> <?php echo $form->error($model,'password'); ?> <?php echo CHtml::SubmitButton('  ', array( 'type' => 'POST', //     ,  //  CSS- #msg. 'update' => '#msg', 'class'=>'journalFancySubmit', )); ?> <?php $this->endWidget(); ?> 

If everything is very sad, and your project on win-1251, like mine, then your template will appear in small squares, that is, not in that encoding. Hollivarschiki say - redo urgently in utf, and they will be right, but unfortunately, the realities are often such that for one reason or another, the entire project cannot be transferred to the religiously correct encoding, but to work it is necessary. The simplest crutch seemed to me to just make the template file itself in the utf-8 encoding. Then everything is given correctly.

Processing ajax validation in the controller, again problems in the encoding

In order for the controller to work correctly with the ajax-validation installed by you, you need to add processing of the ajax-request in the controller, this is usually done like this:

 if (isset($_POST['ajax']) && $_POST['ajax'] === 'login-form') { echo CActiveForm::validate($model); Yii::app()->end; } 

But in the case of win-1251, we get an error, because json_encode, which is called at the end to return the result of validation does not want to work with this encoding. We need to rewrite the validate method:

 protected function validate($models, $attributes=null, $loadInput=true) { $result=array(); if(!is_array($models)) $models=array($models); foreach($models as $model) { if($loadInput && isset($_POST[get_class($model)])) $model->attributes=$_POST[get_class($model)]; $model->validate($attributes); foreach($model->getErrors() as $attribute=>$errors) $result[CHtml::activeId($model,$attribute)]=$errors; } if (empty($result)) { $utf_result = array(); } foreach ($result as $key => $value) { if (is_array($value)) { foreach ($value as $inner_key => $inner_value) { $utf_result[$key][$inner_key] = iconv('windows-1251', 'UTF-8', $inner_value); } } else { $utf_result[$key] = iconv('windows-1251', 'UTF-8', $value); } } return function_exists('json_encode') ? json_encode($utf_result) : CJSON::encode($utf_result); } 

Here, the CActiveForm :: validate method is copied and the transcoding of $ result is added at the end.

Accordingly, changing the challenge

 echo CActiveForm::validate($model); 

on

 echo $this->validate($model); 

Now standard error handling will work correctly.

After successful login

The authorization was successful, now is the time to recall the js-function afterValidate, which we connected to clientOptions when creating the authorization form widget:

 'clientOptions'=>array( 'validateOnSubmit'=>true, 'afterValidate' => 'js:afterValidate', 

afterValidate is a function that will be called after performing ajax check.

Incoming parameters - (data, hasError), form - jQuery representation of the form object, data - json-response from the server, HasError - a boolean value indicating whether there were errors during validation.
Note that afterValidate is available only if validateOnSubmit is set to true.

In this function, you can do everything that you need after the user has successfully logged in.

For example, I have it looks like this:

 function afterValidate(form, data, hasError) { if (hasError == false) { window.location.reload(); parent.$.fancybox.close(); } } 

Sources

All solutions are taken from the yii forum and stackoverflow.com and are simply summarized in the article.

Instead of conclusion

I wish you and yourself to work only with projects in utf-8 and enjoy life.