Yii 1.1: eactiveajaxform

Use ajax validation + ajaxSubmitButton together in CActiveForm
4 followers

CActiveForm ajax validation does not work at all when you use ajaxSubmitButton in the form, instead of SubmitButton. The issue is discussed here - http://code.google.com/p/yii/issues/detail?id=2008

You may ask why i need ajaxSubmitButton in a CActiveForm.

We often want to operate on the rows checked in the gridview. Yes, we can do add/update/delete by the CButtonColumn, but a better method is to place a gridview in CActiveForm, and also place some buttons and inputText tag, which is often called Admin Panel, at the bottom of gridview.

In this scenario, if using normal submit button, the current page of grid will be lost when button is clicked. so we need ajaxSubmit buttons in CActiveForm.

Usage

  1. place the EActiveAjaxForm.php into components/ folder

  2. view file

<?php $form=$this->beginWidget('EActiveAjaxForm', array(
    'id'=>'form_id',
    'enableAjaxValidation'=>true,
    'clientOptions' => array(
        'validateOnSubmit'=>true,
        'validateOnChange'=>false,
    ),
    'ajaxSubmitOptions' => array(
        'success' => 'js:function(data, textStatus, XHR) {alert(data); reloadGrid(); }', 
        'error' => 'js:function(XHR, textStatus, errorThrown) {alert(XHR.responseText);}'
    ),
 
)); ?>
 
$this->widget('zii.widgets.grid.CGridView', array(
...
));
 
<div class="row">
    <?php echo $form->labelEx($model,'name'); ?>
    <?php echo $form->textField($model,'name',array('size'=>60,'maxlength'=>64)); ?>
    <?php echo $form->error($model,'name'); ?>
</div>
 
<?php echo CHtml::submitButton('Save',array('name'=>'Save')); ?>
<?php $this->endWidget(); ?>
  1. controller file
public function actionBatchUpdate()
    {
        ...
        if(isset($_POST['ajax']) && $_POST['ajax']==='form_id')
        {
            echo CActiveForm::validateTabular($model);
            Yii::app()->end();
        }
        ...
    }

Resources

http://code.google.com/p/yii/issues/detail?id=2008

Be the first person to leave a comment

Please to leave your comment.

Create extension