如果html前端为:
<table class="table table-striped table-bordered table-hover" id="dataTablesDevice">
<thead></thead><tbody></tbody>
</table>
那么单选实现为:
$('#dataTablesDevice tbody').on('click', 'tr', function() {
if ($(this).hasClass('selected')) {
$(this).removeClass('selected');
} else {
tableLight.$('tr.selected').removeClass('selected');
//其中tableLight为var tableLight = $('#dataTablesDevice').DataTable的返 回值
$(this).addClass('selected');
}
});
删除实现方式为:
del = function()
{
if(tableLight.row('.selected').data() == null)
{
alert("请至少选择一条数据");
return;
}
$('#roleDelModal').modal("show"); //弹出删除的对话框,对话框id为:roleDelModal
}
如果删除需要ajax请求,则:
del_info = function()
{
var tableLight = $('#dataTablesLight').DataTable();
var s = tableLight.row('.selected').data().name;
$.ajax({ //需要引入jquery
url:"/system/delrole",
data:{"name":s},
type:"post",
success:function(data){
alert("删除成功");
$('#roleDelModal').modal("hide");
tableLight.ajax.reload(); //删除后表格自动刷新
},
error:function()
{
alert("fail");
}
});
}
网友评论