trigger active form validation manually before submit

问题

is it possible to call the active form validation programmatically via javascript? I need to call the validation procedure before doing some ajax operations.

回答1:

Guess I'm a bit late with a reply here but I just had the same question and the solution by soju did not work for me either.

So I looked a bit deeper into the JS-code of ActiveForm and found that it appears to monitor the status of each field in a variable and if the field is "untouched" the validation isn't triggered, unless submitting the actual form. So I changed my call to this:

var $form = $("#my-form"), 
    data = $form.data("yiiActiveForm");
$.each(data.attributes, function() {
    this.status = 3;
});
$form.yiiActiveForm("validate");

This now appears to be working as I expect.

回答2:

We can achieve that by merging @BlueZed and @S Rana's answer.

You can write below script, so we can check that if form has any error in it then form will not submit (Even It will work for tabular (wizards) like form ).

    var $form = $("#form"), 
        data = $form.data("yiiActiveForm");
    $.each(data.attributes, function() {
        this.status = 3;
    });
    $form.yiiActiveForm("validate");

    if ($("#form").find(".has-error").length) {
        return false;
    }

回答3:

Thanks blue zed, but before this - to append form field, u need to do this stuff...

// your input

$inputData = $form->field($model,"prductName");

// this remove next line & convert double quotes to single quotes

$newInputData= trim(preg_replace('/\s+/', ' ',str_replace('"',"'", $inputData)));

// then append like this

$("#table").append("'.$newInputData.'");

// this worked for me along with blue zend solution like this below

$this->registerJs('
    $(document).on("click","input[type=text]",function(){
            var $form = $("#w0"), 
            data = $form.data("yiiActiveForm");
            $.each(data.attributes, function() {
                this.status = 3;
            });
            $form.yiiActiveForm("validate");        
    });
');

回答4:

Yes it is possible, you should try this :

$('#form-id').yiiActiveForm('validate');

回答5:

this is worked for me

$this->registerJs( "
        $('body').on('beforeSubmit', 'form#product-form', function () {
             var form = $(this);
             // return false if form still have some validation errors
             if (form.find('.has-error').length) {
                  return false;
             }
             // submit form
             $.ajax({
                  url: form.attr('action'),
                  type: 'post',
                  data: form.serialize(),
                  success: function (response) {

                  }
             });
             return false;
        }); ");

回答6:

The validation is activated when submitting the form. Thus, this will work:

$form.data('yiiActiveForm').submitting = true;
$form.yiiActiveForm('validate', false);

The second argument to validate is called forceValidate.

回答7:

To validate manually from javascript, you should place following code to end of form submit event.

return  $('#your-form-id').yiiActiveForm('validate');

For novice users,

$('#your-form-id').submit(function () {       
    return  $('#your-form-id').yiiActiveForm('validate');
});

Also note that you should specify form id on ActiveForm like below

<?php $form = ActiveForm::begin(['id' => 'd4d-hub-form']); ?>

回答8:

I had the same issue. And the are no clearly solution in official documentation and I don't know why any solution on Stackoverflow does not work for me. May be in the different versions of yii2 there is different ways to do that. I have spent a lot of time to find solution. In my case I have triggered validation for individual input on the form:

$('#form-id').data('yiiActiveForm').submitting = false;
$('#form-id').yiiActiveForm('validateAttribute', 'input-id'); //this will triger validation for input with id 'input-id'
$('#form-id').yiiActiveForm('validateAttribute', 'other-input-id'); //this will triger validation for input with id 'other-input-id'

please notice second parameter of function yiiActiveForm() it is not selector and it is not name of attribute it is id of input of attribute!!!

来源：https://stackoverflow.com/questions/28610439/trigger-active-form-validation-manually-before-submit