laravel 5.3のmodalへの検証json応答の送信

Question

私はlaravelで新しく、モーダルフォームにlaravelビルトイン検証を使用しようとしました。

バリデータなしmy code is complete。しかし、私はバリデーターコードを追加すると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({ 

    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

あなたはトークンあなたCSRFを意味しないか、存在する場合、Laravelは現在のセッションの値を生成一致しないのいずれかであるトークン不一致エラーを経験することができます。これを解決するには

、あなたはどこでもあなたの<form>要素の内容をwithing {{ csrf_field() }}を追加することができます。

POSTパラメータとしてCSRFトークンを有効にするためには、単にのコンテンツ内で次の<meta>要素を追加するには、<head>要素：その後、

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

、自動的にトークンを追加するには、jQueryのを指示し以下のスニペットのように$.ajaxSetup();を使用してすべてのリクエストヘッダーに送信します。後でシナリオに

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

、あなたはもはやあなたが世界的にそれが利用可能となるので、上記のようにX-CSRF-TOKENキーと値のペアを使用してAJAX ヘッダを再定義する必要はありません。あなたは、単に（... here以上、hereを読む）など、$.ajax();、$.get();を使用することができます。

上記のサンプルスニペット。注：ヘッダーはすでにグローバルに使用されているため、定義されていません$.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

一部の検索の後、エラーはトークンの不一致です。それから、$.ajaxの中に

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

を追加しました。

しかし、すべての機能（追加/削除/更新ごとに1）で$.ajaxのトークンを追加するか、$.ajaxsetupでそれを宣言する方が良いかどうかはまだ分かりません。