使用Laravel实现带有输入字段的ajax表单验证

Question

在 Laravel 5.1 项目中，我收到了这个 Ajax 响应作为错误。

{
      "success":false,
      "errors":{
      "drugs_power":["The drugs power field is required."]
      }
}

我需要一个像这张图片一样的错误验证 我可以通过Laravel验证器来实现，下面是从控制器返回的代码：

$this->validate($request, [
            'drugs_name' => 'required|unique:drugs',
            'drugs_group_name' => 'required',
            'drugs_power' => 'required'
        ]);

使用以下代码在blade.php中显示

<div class="form-group{{ $errors->has('drugs_power') ? ' has-error' : '' }}">
   <label for="userName">Power</label>
       <div>
          <input type="text" class="form-control" name="drugs_power"
                                               value="{{old('drugs_power')}}">
        @if ($errors->has('drugs_power'))
          <span class="help-block">
         <strong>{{ $errors->first('drugs_power') }}</strong>
              </span>
           @endif
     </div>


</div>

我该如何实现与此类似的ajax+laravel验证？

- K M Rifat ul alom

---

你到底想做什么？你上面的代码看起来很正常，不是吗？你是想从错误中返回一个特定的消息吗？ - camelCase

是的，我需要从错误中获取一个特定的消息。 - K M Rifat ul alom

无论您使用什么工具来执行ajax提交（jQuery？），它也必须以这样的方式编程，以处理错误数据，然后将错误消息附加到您的HTML中。 Laravel中没有任何神奇的东西可以为您完成它。 - Oliver Maksimovic

Answer 1

将第三个参数传递给validate允许您指定自定义消息，如此处所示。您可以使用“点”符号来将错误消息指定到特定字段。

$this->validate($request, [
    'drugs_name' => 'required|unique:drugs',
    'drugs_group_name' => 'required',
    'drugs_power' => 'required'
], [
    'drugs_power.required' => 'Your custom message here.'
]);

- camelCase

---

当使用 AJAX 请求进行验证时，Laravel 将返回一个 JSON 响应，其中包含所有验证错误。它将使用状态码 422 返回此响应，以便您可以在那里访问这些错误。这个答案 也会对您有所帮助。 - camelCase

Answer 2

你正在寻找https://github.com/whipsterCZ/laravel-ajax

它完全符合你的要求而且更多！

通过ajax发送和验证表单就像这样简单 - 无需配置

HTML

<form action="" class="ajax">...</form>

控制器

public function update(ClientRequest $request, Client $client)
{
    $client->update($request->all());
    $request->session()->flash('success', 'Client has been updated.');

    return \Ajax::redirect(route('clients.index'));
}

它通过自定义的FormRequest验证表单并显示错误（在errorBag中或直接在输入框上方）

- WhipsterCZ

Answer 3

假设您正确使用Laravel请求对象，您将在浏览器中接收到响应代码422。

如果您想全局捕获此错误，可以通过将以下代码放入您的JS中来扩展默认的ajax行为。

$(function () {
    $.ajaxSetup({
        statusCode: {
            422: function (data) {
                    $.each(data.responseJSON, function (k, v) {
                      // do something with the error
                    })
            }
        }
    });
});

- Frederiek