在 laravel 5.3 中向模态发送验证 json 响应

Question

我是 laravel 的新手，并尝试使用 laravel 内置验证来验证我的模态表单。

没有验证器，我的代码运行良好。但是当我添加验证器代码时，它会不断发送 500 内部服务器错误。我不知道这是怎么发生的，我认为所有的变量名都是对的

控制器：

public function addItem(Request $request){

    $validator = Validator::make($request->all(),[
        'code_Item'=>'required|unique|max:4',
        'name_Item'=>'required|unique|max:255',
    ]);

    if($validator->fails()){
        return \Response::json($validator);
    }
    else
    {
        $item = new kategoriBarang;
        $item->code_item = $request->code_item;
        $item->name_item = $request->name_item;
        $item->save(); 
        return \Response::json($item);         
    }   

}

路线：

Route::post('item', 'item_Ctrl@addItem');

js $.ajax:

 $.ajax({

    type: type,
    url: my_url,
    data: formData,
    dataType: 'json',
    success: function(data) {
        console.log(data);
        /*
           success code
        */
    },
    error: function(data) {
        /*
           ihope this data contain the validation error so i can display                    it on the modal
        */
        console.log('Error:', data);
    }
});

谢谢你..

查看：

@extends('layouts.mainlayout')
@section('content')
<!-- Content Wrapper. Contains page content -->
  <div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
      <h1>
        item Barang
        <small>CRUD item barang</small>
      </h1>
      <ol class="breadcrumb">
        <li><a href="#"><i class="fa fa-dashboard"></i> Master Data</a></li>
        <li class="active">item barang</li>
      </ol>
    </section>

    <!-- Main content -->
    <section class="content">

      <!-- Your Page Content Here -->
      <div class="box box-primary">
        <div class="box-header with-border">
              <h3 class="box-title">item Barang</h3>
        </div>
        <div class = "box-body ">
            <div class="">
                <div class="col-sm-8 col-md-8 col-xs-8">
                    <form action ="#" method="get">
                        <div class="input-group">
                            <input type="text" name="q_item-barang" class="form-control" placeholder="Search...">
                                <span class="input-group-btn">
                                    <button type="submit" name="search" id="search-btn" class="btn btn-flat" >
                                        <i class="fa fa-search"></i>
                                    </button>
                                </span>  
                        </div>
                    </form>                
                </div>
                <div class="col-md-4 col-sm-4 col-xs-4 pull-right">
                    <div class="pull-right">
                        <button id="btn-add" class="btn btn-primary open-modal" value="">
                        <i class="fa fa-plus"></i> Add</button>
                    </div>  
                </div>
             </div>
        <br>     
        <br>     

        <div class="container col-md-12 col-sm-12">
                <table class = "table table-bordered table-striped table-fixed">
                    <tbody id="itemBarang-List">
                        <tr>
                            <th class="col-md-2">Kode</th>
                            <th class="col-md-8">Nama item</th>
                            <th class="col-md-2 col-xs-2">Operasi</th>
                        </tr>
                        @foreach($KatBarang as $item)
                        <tr id="ID{{$item->id}}">
                            <td >{{$item->code_item}}</td>
                            <td >{{$item->name_item}}</td>
                            <td >
                                <div class = "btn-group">
                                    <!--editBtn-->
                                    <button id="editBtn" class="btn btn-sm btn-warning open-modal" value="{{$item->id}}">
                                                <i class="fa fa-pencil"></i> </button>
                                    <!--deleteBtn-->
                                    <button id="deleteBtn" class="btn btn-sm btn-danger delete-task" value="{{$item->id}}">
                                                <i class="fa fa-trash"></i> </button>
                                </div>
                            </td>
                        </tr>
                        @endforeach                                            
                    </tbody>                   
                </table>
        </div>
        </div>
        <div class = "box-footer">            
        </div>
      </div>
    </section>
    <!-- /.content -->
  </div>
<!-- /.content-wrapper -->
<!--Modal window-->
<div class="modal fade" id="itemBarang-Modal" tabindex="-1" role="dialog" aria-labeledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden ="true">x</span></button>
                <h4 class="modal-title" id="myModalLabel">item Editor</h4>
            </div>
            <div class="modal-body">
                <form id="frmitemBarang" name="frmitemBarang" class="form-horizontal container-fluid" novalidate="">
                    <div class="form-group error">
                        <div class="form-group">
                            <label class="col-sm-3 col-md-3 control-label" style="text-align: right;">Kode item</label>
                            <div class="col-sm-9 col-xs-12">
                                <input type="text" id="code-item" name="code-item" placeholder="Kode.." class = "form-control" value="">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 col-md-3 control-label" style="text-align: right;">Nama item</label>
                            <div class="col-sm-9 col-xs-12">
                                <input type="text" id="name-item" name="name-item" placeholder="item.." class = "form-control" value="">
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
            <button type="button" class="btn btn-primary" id="btn-save" value="add">Save changes</button>
            <input type="hidden" name="Item_id" id="Item_id" value="0">
            </div>
        </div>
        </div>  
    </div>
</div>
@endsection

@section('script')
<meta name="_token" content="{{csrf_token()}}" />       
<script src="{{asset('js/crud-js/item-barang.js')}}"></script>
@endsection

Answer 1

您可能遇到 token mismatch 错误，这意味着您的 CSRF 令牌 不存在，或者如果存在，与 Laravel 为您当前会话生成的值不匹配。

要解决此问题，您可以在 <form> 元素的内容的任何位置添加 {{ csrf_field() }}。

为了启用 CSRF 令牌作为 POST 参数，只需在 <head> 元素的内容中添加以下 <meta> 元素：

<meta name="csrf-token" content="{{ csrf_token() }}">

然后，使用 $.ajaxSetup(); 指示 jQuery 自动将令牌添加到所有请求标头中，如下面的 sn-p 所示；

$.ajaxSetup({
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    }
});

在后一种情况下，您不再需要像上面那样使用 X-CSRF-TOKEN 键值对重新定义您的 AJAX 标头，因为您已将其设为全球可用；您可以简单地使用 $.ajax();、$.get(); 等。（...阅读更多 here 和 here）。

上面解释的示例sn-p；注意：headers 没有定义，因为它已经在全局使用 $.ajaxSetup();。

$.ajax({
    url: "https://www.https://stackoverflow.com/",
    type: "GET",
    dataType: "json",
    data: formData,
    success: function(data, status) {
        console.log("Data: " + data + ", Status: " + status);
    },
    error: function(data) {
        console.log("Error: " + data);
    }
});
// where formData returns your form data in the appropriate format, here, JSON.

其他有用的资源和参考here。

Answer 2

经过一番搜索，错误是令牌不匹配。然后我加了

header: 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')

在$.ajax 中，它现在可以工作了。

但是，我仍然不清楚是在每个函数的 $.ajax 内添加令牌（每个添加/删除/更新 1 个）更好还是只在 $.ajaxsetup 中声明它。