yii2 ajax 验证表格

Question

I have a form master detail for tabular input and with enabledAjaxValidation=true

So far so good, the form validates all the rules and shows the error messages when submitting or changing any value of any control (onchange event). The problem comes when I add controls to the form using ajax, the latter do not behave like the original ones, they do not show the error messages.

The same when do submit with button I think that

Answer 1

You need to add the newly created/added field to the validation manually for any dynamically created inputs using the yiiActiveForm.add() function.

You havent added the code you are currently using when you click on the button and add a new input to the form via ajax. So what you need to do is when you receive the response and append the input to the form just add the new input using the following code.

Note: Change the form and field attributes accordingly

$('#form-id').yiiActiveForm('add', {
    id: 'input-id',
    name: 'input-name',
    container: '.field-input',
    input: '#input-id',
    error: '.help-block',
    validate:  function (attribute, value, messages, deferred, $form) {
        yii.validation.required(value, messages, {message: "Validation Message Here"});
    }
});

Read more about the activeform valiadation js

Update

If you dont wish to add the validation function manually for every input and you have tabular inputs you can access any of the already created similar field and bind the validation function from it.

For instance in the above example if the the name field is tabular and belongs to the model Contact and you already have a name field populated in the form #contact-0-name you can use the yiActiveForm.find() function to access the attributes of that field and assign the existing validation. see an example below

var fieldAttributes = $("#form-id").yiiActiveForm("find", 'contact-0-name');
$('#form-id').yiiActiveForm('add', {
    id: 'contact-1-name',
    name: '[1][name]',
    container: '.field-name',
    input: '#contact-1-name',
    error: '.help-block',
    validate:  fieldAttributes.validate
});

Answer 2

use somthing like below code

 error: function(jqXHR,textStatus,errorThrown) { stopLoader('.modal-content'); $('.csv_errors').show(); if(jqXHR.status==422){ var responseText = $.parseJSON(jqXHR.responseText); $.each(responseText.errors,function(key,value){ $('.csv_error ul').append('<li>'+value+'</li>'); }); }else{ var responseText = $.parseJSON(jqXHR.responseText); $('.csv_error ul').append('<li>'+responseText.message+'</li>'); } }