Question

我使用带数据表的laravel来显示大数据表。

我在每行末尾都有一个删除按钮，用于删除数据库中的记录。我使用ajax，如果成功，我会删除该行。

它在桌面上运行良好，但它不适用于移动设备（除非我设置了计算机版本）。

这是我的表：

<table class="datatable table table-striped- table-bordered table-hover table-checkable" id="m_table_1">
    <thead>
        <tr>
            <th>Numéro</th>
            <th>Bâtiment</th>
            <th>Nature</th>
            <th>Options</th>
        </tr>
    </thead>
</table>

我的js加载数据：

 var table =     $('.datatable').DataTable({
        responsive: true,
        ajax: '{{ route('lots.clientSide') }}',
        deferRender: true,
        scrollY: '500px',
        scrollCollapse: true,
        scroller: true,
        stateSave:      true,
        select: true,
        language: {
            url: "//cdn.datatables.net/plug-ins/1.10.16/i18n/French.json",
            select: {
        rows: "%d éléments sélectionnés"
    }
        },   
        columns: [
            { data: 'id' },
            { data: 'batiment.nom', defaultContent: "----" },
            { data: 'nature' },
            { data: null }
        ],
        columnDefs:[
            {targets:-1,title:"Options",width: "10%",orderable:!1,render:function(a,t,e,n){
            var slug = e.id;
            var url = 'show';
            var url_delete =  "lots/delete/"+e.id;
            return '\n<a href="'+url+'" class="m-portlet__nav-link btn m-btn m-btn--hover-brand m-btn--icon m-btn--icon-only m-btn--pill" title="View">\n'+
            '<i class="la la-eye"></i>\n'+
            '</a>'+
            '<span class="dropdown">\n'+
            '<a href="#" class="btn m-btn m-btn--hover-brand m-btn--icon m-btn--icon-only m-btn--pill" data-toggle="dropdown" aria-expanded="true">\n'+
            '<i class="la la-ellipsis-h"></i>\n'+
            '</a>\n'+
            '<div class="dropdown-menu dropdown-menu-left">\n'+
            '<a class="dropdown-item" href="#"><i class="la la-edit"></i> Editer</a>\n'+
            '<button class="delete dropdown-item" data-href="'+url_delete+'"><i class="la la-trash"></i> Supprimer</button>\n'+
            '</div>\n'+
            '</span>\n'

            }}
        ]
    });

我的删除代码：

$(document).on('click', '.delete', function(e){
            var $this = $(this);
            table.row($this.parents('tr')).remove().draw(false);
            alert("click");
            $.ajax({
                    type: 'GET',
                    url: $this.data('href'),
                    dataType: 'json',
                    success: function( data ) {

   },
   error: function(xhr, status, error) {
     alert("fail");
   }         
            })


        });

我尝试在计算机上使用调试工具，但我在控制台上什么都没有。

如果我在电脑上使用该功能，它可以工作。但是如果我减小窗户的尺寸，它就不会在一定的尺寸下工作。

这是正常的吗？我能为此做些什么吗？

感谢

Answer 1

我设法通过不隐藏手机上的删除按钮来避免此问题。

数据表删除移动设备上的行

1 个答案: