如何将数组发送到控制器使用 ajax？

Question

我有一个带有复选框的数据表和一个允许通过数组填充表 ITEMS [] 的验证按钮，我想使用 ajax 将此数组发送到我的控制器。请帮忙。

这是我的数据表：

 <div id='form2'>
    <h3>form group 2</h3>
    <h4>DATE : <span id="dateE"></span></h4>
    <h4>chantier : <span id="ch"></span></h4>
    <div class="form-group col-md-offset-5 ">
        <button class="btn btn-success add-all" type="submit" id="hide">Pointage</button>
    </div>
    <table class="table table-bordered" id="mytable">
        <tr>
            <th>Archive</th>
            <th><input type="checkbox" id="check_all"></th>
            <th>S.No.</th>
            <th>matricule</th>
            <th>nom & prenom</th>
            <th>salaire net</th>
            <th>nbre de jour </th>
            <th>prime</th>
        </tr>
        @if($salaries->count())
            @foreach($salaries as $key => $salarie)
                <tr id="tr_{{$salarie->id}}">
                    <td>archive</td>
                    <td><input type="checkbox" class="checkbox" data-id="{{$salarie->id}}"></td>
                    <td>{{ ++$key }}</td>
                    <td>{{ $salarie->matricule }}</td>
                    <td >{{ $salarie->nom }} {{ $salarie->prenom }}</td>
                    <td>
                        <input type="hidden" name="salaire" value="{{ $salarie->salairenet }}">
                        {{ $salarie->salairenet }}
                    </td>
                    <td ><input type="text" class='input2' name="nbreJ" class="form-control" ></td>
                    <td><input type="text" name="prime" class="form-control" value="0"></td>
                </tr>
            @endforeach
        @endif
    </table>
 </div>

这是我的 jquery 代码：

$('.add-all').on('click', function() {
    var items = [];
    let valu = $('#datePicker').val();
    $("tr").each(function(i,r) {
        if ( i > 0 && $(r).find("input").first().prop("checked")) {  

            items.push({"matricule": r.cells[3].innerText, "salaire": r.cells[5].innerText, "date" : valu })
        }
    });

    //ajax
    $.ajax({ 
        method      : 'POST', 
        url       : 'mois', 
        data      : items, 
        success   : function(data) {
            if (!data.success) {
                if (data.errors.name) { 
                    $('.throw_error').fadeIn(1000).html(data.errors.name); 
                }
            } else {
                $('#success').fadeIn(1000).append('<p>' + data.posted + '</p>'); 
            }
        }
    });
});

路线：

Route::post('mois', 'SalarieController@addMultiple');

控制器：

public function addMultiple(Request $request)
{
    dd($request->all());
}

Answer 1

试试这个你忘了传递令牌和json密钥

$.ajax({ 
        method      : 'POST', 
        url       : 'mois', 
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        data      : {"items":items}, // pass in json format 
        success   : function(data) {
            console.log(data);
        },
        error : function(err){
            console.log(err)
        }
    });
 //fin ajax 
  }); 

在你的控制器中

public function addMultiple(Request $request){
    return response()->json([
            'status'=>200,
            'message' => "success",
            'data' => $request->all()
    ]);
}

Answer 2

（我没有足够的代表发表评论）

1. 您的控制器是否有任何响应？
2. 尝试使用“/mois”作为 ajax url（带有斜杠）

3. 您是否设置了 jQuery Ajax 以使用 CSRF 令牌？ https://laravel.com/docs/5.8/csrf#csrf-x-csrf-token

4. Laravel 带有 Axios（非常棒，并且已经配置为使用 CSRF 令牌）用于 HTTP 请求，您尝试过使用它吗？

Axios 请求应该是这样的；

axois.post('/mios', items)
.then((response) => {
  console.log(response)
})
.catch((error) => {
  console.log(error)
})