Форма Ajax отправляется несколько раз

Question

В моем контроллере есть действие, которое отправляет новую модель.Форма находится в модальном всплывающем окне, и мне нужна полная проверка AJAX.Все работает, кроме формы, представленной несколько раз подряд.Это работает, если я удаляю команду yiiActiveForm ('validate'), но мне нужно, чтобы она была подтверждена перед отправкой.

$('#myformid').off('submit').on('submit', function(e){
    e.preventDefault();
    e.stopImmediatePropagation();


    var form = $(this);
    var formData = form.serializeArray();
    form.data('yiiActiveForm').submitting = true;
    form.yiiActiveForm('validate');

    $.ajax({
        url: form.attr("action"),
        type: form.attr("method"),
        data: formData,
        success: function (data) {

            if(data !== false){
                $('#modal-add-associate').modal('hide');
            }
        },
        error: function () {

        }
    });
    return false;

});

Форма начинается с

$form = ActiveForm::begin(['enableAjaxValidation' => true,'validationUrl'=> $validationUrl]); 

Так обычно проверяетсяпо Ajax с пользовательским URL (и это работает, кроме как при отправке).Как я могу запустить проверку, когда форма будет отправлена?

Answer 1

Вы должны использовать beforeSubmit событие, а не submit, прежде всего, поскольку вы используете activeform, а Yii2 ActiveForm предоставляет вам следующие события формы

Доступные события:

• beforeValidate.
• afterValidate.
• beforeValidateAttribute.
• afterValidateAttribute.
• beforeSubmit.
• ajaxBeforeSend.
• ajaxComplete.

Подробнее о ActiveForms

Рассматривая свой javascript и проблему, вам не нужны эти строки

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

, потому что если вы используете кнопку типа submit для отправки формы, проверка запускается автоматически, так как опция validateOnSubmit по умолчанию true для ActiveForm, поэтому вы должны удалитьих.

Убедитесь, что в активной форме есть кнопка типа submit, форма должна выглядеть следующим образом

$form = ActiveForm::begin(['enableAjaxValidation' => true,'validationUrl'=> $validationUrl]);

//Your fields
//.....
//.....
echo Html::submitButton('Submit', ['class' => 'btn']); 
ActiveForm::end();

И вам нужно пересмотреть свой javascript, вам не нужно использовать .off().on() как beforeSubmit будет вызываться только один разФорма проверена и проходит проверку, и вы используете опцию type в вызове ajax, который является псевдонимом для method.Вам следует использовать type, если вы используете версии jQuery до 1.9.0.что не ваш случай, я думаю.Если вы используете последнюю версию Yii 2.0.16, то она включает Jquery 3.3.1 по умолчанию через yii\web\JqueryAsset, поэтому вы можете изменить ее на method.

$('#myformid').on('beforeSubmit', function (e) {
    e.preventDefault();

    var form = $(this);
    var formData = form.serializeArray();

    $.ajax({
        url: form.attr("action"),
        method: form.attr("method"),
        data: formData,
        success: function (data) {
            if (data !== false) {
                $('#modal-add-associate').modal('hide');
            }
        },
        error: function (jqXHR, textStatus, errorThrown) {
            console.log(jqXHR, textStatus, errorThrown);
        }
    });
    return false;
});