Ali MasudianPour
Ali MasudianPour

Reputation: 14459

Yii ajaxSubmitButton client-side validation issue

As you probably know, Yii does not perform client-side validation with CHtml::ajaxSubmitButton. So after a long time spending on google and stackoverflow, I found that I should use the following link

a-simple-way-to-get-yii-client-side-form-validation-run-when-submitting-by-ajax

Now, It can perform client-side validation. But, the success or complete ajax functions does not fire after validation.

Any Idea?

To be more familiar with topic, I put my codes here:

Yii::app()->clientScript->registerCoreScript('yii');

Yii::app()->clientScript->registerScript('Yii Fix',";$.yii.fix = {
        ajaxSubmit : {  
            beforeSend : function(form) {
                return function(xhr,opt) {
                    form = $(form);
                    $._data(form[0], 'events').submit[0].handler();
                    var he = form.data('hasError');
                    form.removeData('hasError');
                    return he===false;
                }
            },

            afterValidate : function(form, data, hasError) {
                $(form).data('hasError', hasError);
                return true;
            }
        }
    };",CclientScript::POS_HEAD);

My form:

$uniqid = uniqid();

$form = $this->beginWidget('CActiveForm', array(
'id' => 'pagescontents-add-new-contents'.$uniqid,
'htmlOptions' => array(
    'class' => 'form-horizontal',
    'role' => 'form'
),
'enableClientValidation' => true,
'enableAjaxValidation'=>true,
'clientOptions' => array(
    'validateOnSubmit' => true,
    'validateOnChange'=>false,
    'afterValidate'=>'js:$.yii.fix.ajaxSubmit.afterValidate',
),
));
//The rest of code
...
//Ajax submit button

$button_uniqid = uniqid();
echo CHtml::ajaxSubmitButton(Messages::getMessage('ADD_NEW'), $this->createUrl('pagescontents/addPage/'), array(
            'beforeSend' => '$.yii.fix.ajaxSubmit.beforeSend("#pagescontents-add-new-contents'.$uniqid.'")',
            'type'=>'POST',
            'success' => "js:function(data){
                            $('#page_modal').html(''); 
                            $('.modal-backdrop').remove(); 
                            $('#pageContents_list').html(data);
                        }", 

        ),
        array(
            'class' => 'btn btn-primary',
//          'data-dismiss' => 'modal',
            'id' => 'deletesubmit_' . $button_uniqid
            )
        );

Upvotes: 2

Views: 3323

Answers (1)

phpniki
phpniki

Reputation: 758

I try your code and find that if you remove the line "'enableAjaxValidation'=>true," your code will work perfectly please check it and let me know that is work for you too or not.

Upvotes: 1

Related Questions