php - 数据表在移动设备上删除行
问题描述
我使用 laravel 和 datatable 来显示大型数据表。
我在每一行的末尾都有一个删除按钮,用于从我的数据库中删除记录。我使用 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");
}
})
});
我尝试在计算机上使用调试工具,但控制台上什么也没有。
如果我在计算机上使用该功能,它可以工作。但是如果我减小窗口的大小,它在一定大小下不起作用。
正常吗?我能做点什么吗?
感谢
解决方案
我设法通过不隐藏移动设备上的删除按钮来避免这个问题。
推荐阅读
- ios - UIScrollView 没有显示在视图中
- spring - 发生模板解析错误。(Spring Boot + Thymeleaf)具有布局和静态
- spring - 只接受为生成的 Spring-Server 定义的参数
- java - Java计算字符串中数字、特殊字符和字母的变化次数
- mysql - AUTO_INCREMENT 不受控制的增加
- python - 考虑到数据库的灵活结构和查询,如何在 Django 中使用 mongodb?
- android - 下载模块时出现拆分错误安装
- java - 为什么我在三元运算符中得到 NullPointerException?
- fortran - 之后的意外垃圾?
- angular6 - Popin 在 IE11 中没有关闭