Laravel 8-此路由不支持POST方法.支持的方法:DELETE

Question

我试图通过点击输入提交按钮提交表格来从DataTable中删除一条记录，但此错误总是显示：

Symfony\Component\HttpKernel\Exception\MethodNotAllowedHttpException此路由不支持POST方法。支持的方法：DELETE。

这是我当前在web.php中声明的进入：的路由

Route::delete('sales/deleteSalesOrder/{id}', 'TransactionSaleController@deleteSalesOrder')->name('sales/deleteSalesOrder/{id}')->middleware('role:A');

这是我在DataTable:中创建表单的代码片段

public function dataTableTrash()
{
$data = SalesH::where('active', '=', 2);

return Datatables::of($data)
->addColumn('action', function($data){
$url = url('transaction/sales/'.$data->id);
$undoTrash = url('sales/undoTrash/'.$data->id);
$urlDestroy = url('sales/deleteSalesOrder/'.$data->id);
$view = "<a class = 'btn btn-primary' href = '".$url."' title = 'View'><i class = 'nav icon fas fa-eye'></i></a>";
$undo = "<button data-url = '".$undoTrash."' onclick = 'undoTrash(this)' class = 'btn btn-action btn-success' title = 'Re-Activate'><i class='fas fa-trash-restore-alt'></i></button>";
$delete = "<form action='$urlDestroy' class = 'deleteForm' method='post'>
<div class='form-group'>
<input type='submit' class='btn btn-danger delete-user' value='Delete'>
</div>
</form>";

return $view."".$undo."".$delete;
})->editColumn('date', function($data){
return date('d-m-Y', strtotime($data->date));
})->editColumn('total', function($data){
return number_format($data->total, 0, '.', ',');
})
->rawColumns(['action'])
->make(true);
}

正如您所注意到的，该表单还没有csrf_field()和method_field('DELETE')。我只是在blade文件中使用JQuery添加了它。

@push('js')
<script>
$(document).ready(function() {
$('.deleteForm').submit(function(event) {
event.preventDefault();
console.log('LOL I am working!');
$(this).append('{{ csrf_field() }}');
$(this).append('{{ method_field('DELETE') }}');
if (confirm('Are you sure you want to PERMANENTLY delete this data?')) {
event.currentTarget.submit();
});
}
</script>
@endpush

最后是我的deleteSalesOrder()(删除数据的方法(：

public function deleteSalesOrder($id)
{
$data = SalesH::find($id);
$data->delete();
if($data->save()){
Toastr::success('Sales Order has been permanently deleted.', 'Success');
return view('Transaction.Sales.index');
}else{
Toastr::error('Sales Order failed to be deleted.', 'Error');
return view('Transaction.Sales.index');
}
}

导致此错误的原因是什么？使用JQuery只追加csrf_field()和method_field('DELETE')是否正确？在这种情况下，我如何解决问题并成功删除数据？

Answer 1

这里的问题是您正在附加一个名为deleteForm的表单，该表单不存在。from中没有name属性，而是一个id属性。每个表单都有相同的id，这在dom中是不起作用的。应该只有一个元素有id。最好使用class属性，在提交表单时，将那些csrf和方法字段添加到该表单中，而不是在文档中。表单

<form action='$urlDestroy' class='deleteForm' method='post'>

然后在脚本中

$('.deleteForm').submit(function(event) {
event.preventDefault();
$(this).append('{{ csrf_field() }}');
$(this).append('{{ method_field('DELETE') }}');
// write confirm code if you want
event.currentTarget.submit();
});