如何在 yii2 中发送一个 ajax 表单

Question

我需要在我的 yii2 应用程序中从 html 表单发送数据。我需要使用 ajax 从此表单发送数据并从服务器获取响应以输出它。在 yii 1.0 中，我使用了非常有用的助手 ajaxSubmitButton，但我找不到如何在 yii2 中使用 ajax 从表单发送数据。你能告诉我怎么做吗？有没有关于它的文章？

谢谢。

Answer 1

Yii ActiveForm 在其生命周期的许多阶段支持 JavaScript 事件。您可以使用 beforeSubmit 事件来实现您想要的。在 JavaScript:

$(document).ready(
    $('#myform').on('beforeSubmit', function(event, jqXHR, settings) {
        var form = $(this);
        if(form.find('.has-error').length) {
            return false;
        }

        $.ajax({
            url: form.attr('action'),
            type: 'post',
            data: form.serialize(),
            success: function(data) {
                // do something ...
            }
        });

        return false;
    }),
);

请注意，您可以通过从事件回调中返回 false 来停止表单的正常提交。

Answer 2

当服务器验证规则提交失败时重新加载表单

$form.on('beforeSubmit', function (event, jqXHR, settings) {

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

        $.ajax({
            url: $form.attr('action'),
            type: 'post',
            data: $form.serialize(),
            success: function (datos, status, xhr) {
                var ct = xhr.getResponseHeader("content-type") || "";
                //fail server validation
                if (ct.indexOf('html') > -1) {
                    if ($(datos).find(".has-error").length)
                    {
                        modal.modal('show');
                        modal.find(".modal-body").html(datos);

                    }
                }
                //real success
                if (ct === "" || ct.indexOf('json') > -1) {
                    modal.modal('hide');

                }
            },
            error: function (datos) {
                alert(datos.responseText);
            },
            complete: function (datos) {
                console.log(datos);
            }
        });

        return false;
    })

如何在 yii2 中发送一个 ajax 表单

How to send an ajax form in yii2

yii2