使用Ajax与jQuery实现表格行及Laravel后端数据同步删除的问题求助

看起来你已经搞定了前端行删除的部分，但后端数据没动静是因为几个细节出错了，我帮你一步步排查修复：

1. 修复Ajax请求的变量与逻辑错误 #

你的Ajax代码里有两处关键问题：

• 拼接URL时用了未定义的cp变量，应该用你获取到的id
• 你先删除了前端行再发请求，容易出现「前端删了但后端删失败」的不一致情况，应该等后端确认删除成功后再操作前端

修改后的Ajax代码：

$(".remove-tr").click(function(){
  const $targetRow = $(this).parents('tr'); // 先保存要删除的行元素
  const itemId = $(this).data("id");
  const csrfToken = $("meta[name='csrf-token']").attr("content");
  
  $.ajax({
    url: `/componente_projetos/${itemId}/`, // 用模板字符串拼接正确路径，和路由末尾斜杠保持一致
    type: 'DELETE',
    data: {
      "_token": csrfToken // 无需额外传id，路由模型绑定会自动处理
    },
    success: function (response){
      $targetRow.remove(); // 后端删除成功后，再移除前端行
      alert('删除成功'); // 可选：给用户直观反馈
    },
    error: function(xhr){
      console.error('删除失败原因:', xhr.responseText); // 方便调试排查
      alert('删除失败，请重试');
    }
  });
});

2. 修复Laravel路由模型绑定与删除逻辑 #

你的控制器有两个致命问题：

• 路由参数是{cp}，但控制器参数是componente_projeto $componente_projeto，变量名不匹配导致路由模型绑定失效，Laravel找不到要删除的实例
• 你把核心的$componente_projeto->delete();注释掉了，这就是后端没删数据的直接原因

修改后的控制器代码：

public function destroy(componente_projeto $cp) { // 变量名和路由参数{cp}保持一致
  $cp->delete(); // 取消注释，执行删除操作
  return response()->json(['message' => '删除成功'], 200); // Ajax请求要返回JSON，不要用重定向
}

3. 确认路由与请求路径一致性 #

你的路由定义是Route::delete('/componente_projetos/{cp}/', [...]);，注意末尾有斜杠，Ajax的URL要对应上（开头加斜杠避免相对路径出错）。另外，确保你的模型类名符合Laravel规范（一般是大驼峰命名，比如ComponenteProjeto），如果模型名写错，路由模型绑定也会失效。

可选：前端细节优化 #

你之前注释了表单，用Ajax的话确实不需要表单，但要确保页面头部存在meta[name='csrf-token']标签（你已经在代码里用到了，没问题）。

把这些修改完成后，点击删除按钮就会先请求后端删除数据，确认成功后再移除前端表格行，就能保证前后端数据同步了。

内容的提问来源于stack exchange，提问作者papi chavez