Php 如何编写ajax脚本来删除条目？

你好！ 请告诉我如何通过Ajax正确实现删除Laravel记录的方法。我写了一个剧本，但不知怎的，它写得很歪。 零件中的脚本可以工作，但当您单击“删除”按钮时，记录不会消失。它只有在重新加载页面后才会消失。当我试图删除一条新记录时，一个路由错误就会飞起来

路线

形式

@csrf@method（'DELETE'）
Удалить

还有我的剧本

<script type="text/javascript">
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });

    $('#delete').on('click', function(e) {
        e.preventDefault();
        var $this = $(this),
            data = $this.data();

        $.ajax({
            url: "{{route('deletePost', ['id' => $post->id])}}",
            method: 'POST',
            data: data,
            success: function(data) {
                $( data ).remove();
            },
            error: function(d) {
                console.log(d);
            }
        })
    })
</script>

$.ajaxSetup({
标题：{
'X-CSRF-TOKEN'：$（'meta[name=“CSRF-TOKEN”]）.attr（'content'））
}
});
$（'#delete'）。在（'click'，函数（e）{
e、 预防默认值（）；
变量$this=$（this），
data=$this.data（）；
$.ajax({
url:“{route（'deletePost'，['id'=>$post->id]）}”，
方法：“POST”，
数据：数据，
成功：功能（数据）{
$（数据）.remove（）；
},
错误：函数（d）{
控制台日志（d）；
}
})
})

您必须首先从路由中删除ID：

Route::delete('/id/delete', 'ProfileController@delete')->name('deletePost');

必须为每个html记录（或行）指定一个类名。 如以下代码所示：

<table>
    <tbody>
        @foreach($records as $record)
        <tr class="myRow">
            ...
        </tr>
        @endforeach
    </tbody>
</table>

var data = $(this).closest("form").serialize();
$.ajax({
    url: "{{route('deletePost')}}",
    method: 'POST',
    data: data,
    success: function(data) {
        $(this).closest("#myRow").remove();
    },
    error: function(d) {
        console.log(d);
    }
})

我希望有帮助

<table>
    <tbody>
        @foreach($records as $record)
        <tr class="myRow">
            ...
        </tr>
        @endforeach
    </tbody>
</table>

<form method="post" id="formDelete">
    <input type="hidden" name="id" value="{{$record->id}}">
    @csrf @method('DELETE')
    <button type="submit" id="delete" class="btn btn-outline-dark btn-sm mt-4">Удалить</button>
</form>

var data = $(this).closest("form").serialize();
$.ajax({
    url: "{{route('deletePost')}}",
    method: 'POST',
    data: data,
    success: function(data) {
        $(this).closest("#myRow").remove();
    },
    error: function(d) {
        console.log(d);
    }
})