将 JS 变量（数组）传递给 Laravel 控制器

Question

我有一个使用 JS 和 Laravel 的项目。

在blade.php 中，我有一个带有复选框的项目列表，我根据其状态从外部数据库中检索到该列表。我需要能够选择一些项目并通过单击更改其状态（例如“存档”）。

  function getSelected(){
  let selected = new Array()
  let tblTickets = document.getElementById('tblTickets')
  let checked = tblTickets.getElementsByTagName("input")
  for (let i = 0; i < checked.length; i++) {
    if (checked[i].checked) {
        selected.push(checked[i].value)
    }
 }
  if (selected.length > 0) {
   let nr = selected.map(Number)
    console.log(nr)

 }
}

这是我的 JS 代码，它为我提供了数字数组（id(s)- 所选项目的主键）

在 web.php 中，我为更新创建了命名路由：

Route::put("/tickets/update", [TicketsController::class, 'update'])->name('tickets.update');

在门票控制器中，我有以下功能：

public function update($ids){
    foreach ($ids as $id) {
        $tickets = DB::connection('secondDB')->table('ticket')
            ->join('ticket_status', 'id', '=', 'status_id')
            ->where('id', '=', $id)
            ->update(['name' => 'Closed']);
    }
     $route= route('tickets.update');
    return view('tickets', [
        'tickets' => $tickets, 
        'route' => $route

}

（它第二个连接的外部数据库，所以我无法为它制作模型，所以我手动白查询）

在tickets.blade 中我添加了脚本，这样我就可以在JS 中访问路由变量

 <script>
  const ticketsApi = @json($route);
 </script>

我的问题是 - 如何使用我在 Blade.php 中传递的路由将一组已检查票证的 ids 发布到控制器中的“更新”函数？ （我知道我也可以在 JS 中循环，但如果我有 1000 个票证，我需要 POST 1000 个请求，我发现在 PHP 中循环更有效）。

这个不行

 fetch(route,
    {
        method: "POST",
        body: JSON.stringify(numbers)
    })
    .then(res => res.json())
    .catch(error => {
        console.error('Error:', error);

    })
    .then(data => {
        console.log(JSON.stringify(data));
    });

感谢您的任何提示。

更新：

js函数：

function getSelected(){
let payload = new Array()
let tblTickets = document.getElementById('tblTickets')
let checked = tblTickets.getElementsByTagName("input")
for (let i = 0; i < checked.length; i++) {
    if (checked[i].checked) {
        payload.push(checked[i].value)
    }
}
let numbers = []
if (payload.length > 0) {
    numbers = payload.map(Number)
    console.log(numbers)
}

const putMethod = {
    method : 'PUT',
    headers: {
        'Content-type': 'application/json; charset=UTF-8'
    },
    body: JSON.stringify(numbers)
}
fetch(urlUpdate, putMethod)
    .then(res => res.json())
    .then(data => {
        console.log(data);
    })
    .catch(error => {
        console.error('Error:', error);

    })

}

web.php：

Route::put("/tickets/update", [TicketsController::class, 'update'])->name('tickets.update');

控制器：

 public function update(Request $request): \Illuminate\Http\JsonResponse
{
    $request->validate([
        'ids' => ['required', 'array', 'min:1'],
        'ids.*' => ['integer']
    ]);
        $tickets = DB::connection('secondDb')->table('ticket')
            ->join('ticket_status', 'id', '=', 'status_id')
            ->whereIn('id', $request->input('ids'))
            ->update(['name' => 'Closed ']);


    return response()->json([
        'ticketsUpdated' => $tickets
    ]);

}

我仍然收到两个错误： action.js:57 PUT http://mypath/tickets/update 419（未知状态） action.js:63 错误：SyntaxError: Unexpected token

我真的不知道如何传递我的数组，将其拆分为数字作为 id 并更新数据库。我有一个内部数据库的内置更新路线。但是对于外部我不能使用 safe() 并且内置函数在路由 /bills/{id} 中提供了一个 id，但我想更新一堆，而不是一个一个

Answer 1

首先，您在获取请求中使用POST 方法，而您的路由使用PUT 动词。 因此，您必须将 fetch 中指定的方法更改为 PUT。

以下是您的控制器的一些问题：

1. 您的 id 数组在您的请求正文中，而不是作为 URL 的参数，因此您需要调整控制器操作以使用请求。

2. 您想使用带有 id 列表的路由来避免对数据库进行 1000 次查询，但您正在这样做，因为您使用的是 foreach 并且它没有经过优化。您可以改用whereIn()。

3. 知道您正在使用 fetch，因此更愿意返回 JSON 响应而不是视图。

这是一个代码示例：

public function update(Request $request)
{
    $request->validate([
        'ids' => ['required', 'array', 'min:1'],
        'ids.*' => ['integer']
    ]);

    $tickets = DB::connection('secondDB')->table('ticket')
            ->join('ticket_status', 'id', '=', 'status_id')
            ->whereIn('id', $request->input('ids'))
            ->update(['name' => 'Closed']);

    return response()->json([
      'ticketsUpdated' => $tickets;
    ]);
}

Answer 2

谢谢大家。我找到了解决方案，让它在没有 JS 的情况下仅 Laravel 工作

在刀片中：

 <form action="/tickets/update" method="POST">
 @csrf
 @method('PUT')

 @foreach($tickets as $ticket)

                <tr>
                    <td>
                        <input class="check" type="checkbox" id="{{$ticket->ticket_id}}" value="{{$ticket->ticket_id}}" name="ids[]" >
                    </td>

在控制器中：

 public function update(Request $request)
{
    $numbers = $request->input('ids');
    foreach ($numbers as $number)
    {
        $tickets = DB::connection('osdtbs')->table('ticket')
            ->where('ticket_id', '=', $number)
            ->update(['status_id' => '7']);
    }


    return redirect('/tickets');

}