Question

我想创建一个ajax表单验证，验证表单数据并在真正提交表单之前为用户提供即时反馈。

为此我在表单提交上添加了一个javascript函数：

<form id="x" onsubmit="return dosubmit(this)" action="{{ url('/x') }}" method="POST">

<script>
    function dosubmit(form) {
        $.ajax({
            url: $(form).attr('action'),
            type: 'post',
            data: $(form).serializeArray()
        }).done(function (data) {
            form.submit();
        }).fail(function (data) {
            alert('error');
        });
        return false;
    }
</script>

我已经自定义了表单验证器请求：

class X extends FormRequest
{
    public function authorize()
    {
        return true;
    }

    public function rules()
    {
        return [
            'name' => 'required',
        ];
    }
}

当我的ajax请求失败时，一切正常。我的表单验证器在json中返回错误，我可以将其显示给用户。问题是，当它成功时它实际上发布了两次数据 - 第一次来自ajax请求，第二次是因为我在ajax请求成功后调用form.submit（）。因为我想在提交后重定向用户，我实际上只希望第二次提交到达控制器。这意味着我必须在验证后停止ajax请求。我目前的解决方法是在控制器中有这样的一行：

public function store(X $request)
{
    if ($request->ajax()) {
        return;
    }

    // only actual request reaches here
}

这很有效，但它并不漂亮。我不喜欢在我的控制器中包含这一行。如果我可以在我的请求验证器中做类似的事情，我会很高兴，但是我无法找到从那里验证后返回的好方法。任何想法我怎么能做到这一点？

Answer 1

你可以这样试试：

before 1
test 1
before 1
test 2
before 1
before 2
test 1
before 1
before 2
test 2
before 1
before 2
before 3
test 1
before 1
before 2
before 3
test 2

并且在控制器中正常运行而没有这个......

~~if（$ request-＆gt; ajax（））{~~ <击>返回; <击>}

请提供反馈，如果有效......我也很感兴趣。

Answer 2

您的问题可以通过javascript代码中的一些更改来解决。我认为您对deferred.done()方法的作用感到困惑。在您的代码中，您需要两次提交表单。

让我分解您的js脚本，done()方法用于在提交表单后执行进一步的操作（Please refer）。

在您的代码中，第一个$.ajax实际上将您的表单提交到后端（此处，如果后端有任何错误，您可以在fail部分处理它们）。如果表单成功提交没有任何错误，那么在done部分中，您可以定义在成功提交表单后要执行的操作的功能或操作。

您无需在成功提交表单后定义要执行的操作，而是再次重新提交相同的表单。因此，请从js代码中删除该部分，以及您在后端完成的变通方法。

function dosubmit(form) {
    $.ajax({
        url: $(form).attr('action'),
        type: 'post',
        data: $(form).serializeArray()
    }).done(function (data) {
        // form.submit();
        // handle successful form submission
    }).fail(function (data) {
        alert('error');
    });
    return false;
}

Laravel - 如果ajax请求，请不要在表单验证器后继续

2 个答案: