Question

我是Datatables的新手。我不确定如何在单击一行中的按钮时获取行索引。我得到未定义的对象错误。任何人都可以指导我如何获得行索引吗？

以下是我迄今为止尝试的代码：

 var table = $('#subcategoryDatatable');
    var url = $('#url').val();
    var tableObj = table.DataTable( {
        "processing": true,
        "serverSide": false,


        "aoColumnDefs": [
                          { "bSearchable": true, "aTargets": [ 0 ] },                         
                        ],

        ajax:
         {
            url: url, 
            dataSrc: 'data',
            type: 'GET'
        },

        columns: [ 
            { data: 'id'},
            { data: 'subcategory'},
            { data: 'category'},


    /* DELETE */ {
            mRender: function (data, type, row) {

            return '<a href="#" class="btn btn-danger btn-xs" data-toggle="modal" data-target="#myModal">DELETE</a>'

                }
            }

        ],

    } );


   $("#cancel").click(function()
   {
        $('#myModal').modal('hide');
    });

   $("#delete").click(function(){

        var target_row = $(this).closest('tr').get(0);

         alert('Delete this id '+target_row);

    });

Answer 1

试试这个：

mRender: function (data, type, row) {
     return '<a href="#" id="rowid' + row.id + '" class="btn btn-danger btn-xs" data-toggle="modal" onclick="DeleteRecordModal('+ row.id +')">DELETE</a>'
}

当你点击删除按钮时打开一个模态：

function DeleteRecordModal(id) {
     $("#myModal").modal("show");
     $("#myModal").attr("data-id",id);
}

然后点击模态

上的删除按钮

$("#delete").click(function(){
     var getid = $("#myModal").attr("data-id");
     $("#rowid" + getid).closest("tr").remove();

});

Answer 2

var url = $('#url').val();
var tableObj = $('#subcategoryDatatable').DataTable( {
    "processing": true,
    "serverSide": false,


    "aoColumnDefs": [
                      { "bSearchable": true, "aTargets": [ 0 ] },                         
                    ],

    ajax:
     {
        url: url, 
        dataSrc: 'data',
        type: 'GET'
    },

    columns: [ 
        { data: 'id'},
        { data: 'subcategory'},
        { data: 'category'},
        {
          data: null,
          orderable: false,
          className: "dt-center",
          defaultContent:'<a href="#" class="remove" id=del>Delete</a>'
         }

    ],

} );


$('#subcategoryDatatabletbody ').on('click', 'tr td #del', function () {

    var row = $(this).parents('tr')[0];
    var mydata = (tableObj .row(row).data());
    alert(mydata["Id"]);
    var con=confirm("Are you sure you want to delete this Category"+mydata["category"]);
    if(con)
        {
              // Delete category Code
        }
        else
        {
        }


});

确定所有这些代码都应该在document.ready函数

中

单击动态按钮时如何删除数据表中的行？

2 个答案: