Laravel 5.7.9 中 Yajra 数据表中的删除按钮

Posted 2023-03-14

【中文标题】Laravel 5.7.9 中 Yajra 数据表中的删除按钮

【英文标题】：Delete button in Yajra Datatables in Laravel 5.7.9

【发布时间】：2019-03-29 18:53:02

【问题描述】：

你好，我有具有此操作的 MemberController：

public function anyData()
    
        $members = DB::table('members')
            ->select(['id','email','firstname','lastname','address','zip','city','phone','mobile','work','birthdate']);


        return Datatables::of($members)
            ->addColumn('action', function ($id) 
                return '<a href="member/' . $id->id . '/edit" class="btn btn-primary">Edit</a>
                        <button class="btn" data-remote="/member/' . $id->id . '">Delete</button>
                  '; )->make(true);    
    

这是获取包含数据的表格的 JS 代码：

<script type="text/javascript">

    var table = $('#datatable-member').DataTable(
        responsive: true,
        "language": 
            "url": " asset('/plugins/datatables/lang').'/'.Config::get('app.locale').'.json'"
        ,
        processing: true,
        serverSide: true,
        ajax: ' route('member') ',
        columns: [
            
                "className": 'details-control',
                "orderable": false,
                "data": null,
                "defaultContent": ''
            ,
             data: 'id', name: 'id' ,
             data: 'email', name: 'email' ,
             data: 'firstname', name: 'firstname' ,
             data: 'lastname', name: 'lastname' ,
             data: 'address', name: 'address' ,
             data: 'zip', name: 'zip' ,
             data: 'city', name: 'city' ,
             data: 'phone', name: 'phone' ,
             data: 'mobile', name: 'mobile' ,
             data: 'work', name: 'work' ,
             data: 'birthdate', name: 'birthdate' ,
            data: 'action', name: 'action', orderable: false, searchable: false
        ],
        order: [[1, 'asc']]
    ).$('.btn[data-remote]').on('click', function (e) alert('test') )
    ;

</script>

表格正确显示数据，编辑链接和删除按钮显示正确，但删除按钮中的操作（目前只有警报）不起作用，当我点击时没有任何反应。

我也在 javascript 上尝试过这个，但没有任何改变：

$('#datatable-member').DataTable().on('click', '.btn-delete[data-remote]', function (e) alert('test') )

【参考方案1】：

从 Laravel 框架中删除，您需要使用 X-CSRF Token 进行表单验证。如果您使用 Laravel 资源，请尝试发送正确的删除请求，您可以使用下面的代码，但请确保您的数据表编辑列使用 btn-delete 类，因为您现在使用的是 btn 类。

<script type="text/javascript">

var table = $('#datatable-member').DataTable(
    responsive: true,
    "language": 
        "url": " asset('/plugins/datatables/lang').'/'.Config::get('app.locale').'.json'"
    ,
    processing: true,
    serverSide: true,
    ajax: ' route('member') ',
    columns: [
        
            "className": 'details-control',
            "orderable": false,
            "data": null,
            "defaultContent": ''
        ,
         data: 'id', name: 'id' ,
         data: 'email', name: 'email' ,
         data: 'firstname', name: 'firstname' ,
         data: 'lastname', name: 'lastname' ,
         data: 'address', name: 'address' ,
         data: 'zip', name: 'zip' ,
         data: 'city', name: 'city' ,
         data: 'phone', name: 'phone' ,
         data: 'mobile', name: 'mobile' ,
         data: 'work', name: 'work' ,
         data: 'birthdate', name: 'birthdate' ,
        data: 'action', name: 'action', orderable: false, searchable: false
    ],
    order: [[1, 'asc']]
);

$('#datatable-member').on('click', '.btn-delete[data-remote]', function (e)  
    e.preventDefault();
    $.ajaxSetup(
        headers: 
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        
    );
    var url = $(this).data('remote');
    // confirm then
    $.ajax(
        url: url,
        type: 'DELETE',
        dataType: 'json',
        data: method: '_DELETE', submit: true
    ).always(function (data) 
        $('#datatable-member').DataTable().draw(false);
    );
);

【讨论】：

@m.Sarto 您的欢迎伙伴，很高兴我能帮助您。

@Ray 尝试参考这里***.com/questions/46472812/…

我现在得到了这个 405（不允许的方法）@gooner