Datatable表格单选+删除实现

如果html前端为:


那么单选实现为:


$('#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");

              }

          });

    }

你可能感兴趣的:(Datatable表格单选+删除实现)