Hi all
I’ve spent a lot of time trying to decide this question by myself but all my ways of decision are wrong.
The problem is next. In YiiBootstrap modal window I need to validate form and show errors in it if there are. How to validate form with performAjaxValidation and display validation errors? Or if CJSON::encode($authItemForm->getErrors()) is right way please confirm it
My action:
public function actionCreateItem() {
$authItemForm = new AuthItemForm;
$this->performAjaxValidation($authItemForm);
if (Yii::app()->request->isPostRequest && Yii::app()->request->isAjaxRequest) {
$authItemForm->attributes = Yii::app()->request->getPost('AuthItemForm', null);
if ($authItemForm->validate()) {
echo 'Okay';
} else {
echo CJSON::encode($authItemForm->getErrors());
}
} else {
$this->renderPartial('_authitem', array(
'model' => $authItemForm,
));
}
}
public function performAjaxValidation($model) {
if (isset($_POST['ajax']) && $_POST['ajax'] === 'auth-item-form') {
echo CActiveForm::validate($model);
Yii::app()->end();
}
}
The form:
<?php $form=$this->beginWidget('CActiveForm', array(
'id' => 'auth-item-form',
'enableAjaxValidation' => true,
'enableClientValidation'=>true,
'clientOptions' => array(
'validateOnSubmit' => true,
'validateOnChange' => true,
),
)); ?>
<?php echo $form->errorSummary($model, '', '', array('class' => 'alert alert-error')); ?>
<?php echo $form->labelEx($model,'name'); ?>
<?php echo $form->textField($model,'name'); ?>
<?php echo $form->error($model,'name'); ?>
<?php echo $form->labelEx($model,'description'); ?>
<?php echo $form->textField($model,'description'); ?>
<?php echo $form->error($model,'description'); ?>
<?php echo $form->labelEx($model,'bizRule'); ?>
<?php echo $form->textField($model,'bizRule'); ?>
<?php echo $form->error($model,'bizRule'); ?>
<p class="note"><span class="required">*</span> -- required</p>
<?php $this->endWidget(); ?>
And the index view with modal widget:
<?php $this->beginWidget('bootstrap.widgets.TbModal', array('id'=>'myModal')); ?>
<div class="modal-header">
<a class="close" data-dismiss="modal">×</a>
<h4>Modal header</h4>
</div>
<div class="modal-body"></div>
<div class="modal-footer">
<?php $this->widget('bootstrap.widgets.TbButton', array(
'buttonType' => 'ajaxSubmit',
'type'=>'primary',
'label'=>'Save changes',
'url'=>'#',
'htmlOptions'=>array('onclick' => "js: submitForm()"),
)); ?>
<?php $this->widget('bootstrap.widgets.TbButton', array(
'label'=>'Close',
'url'=>'#',
'htmlOptions'=>array('data-dismiss'=>'modal'),
)); ?>
</div>
<?php $this->endWidget(); ?>
<script>
$('a[data-toggle="modal"]').click(function(e) {
$ ("#myModal").removeData ('modal');
$ ('#myModal').modal ({remote : '<?php echo $this->createUrl('auth/createItem', array('type' => '1')); ?>'});
});
function submitForm() {
$.ajax({
url : '<?php echo $this->createUrl('auth/createItem', array('type' => '1')); ?>',
type : 'POST',
data : $('#auth-item-form').serialize(),
cache : false,
success : function(data) {
console.log(data);
}
});
}
</script>