一键删除多个选定的DataTable行? [英] Delete multiple selected DataTable rows with one click?

问题描述

我正在使用Datatables中的示例从表中删除行.这项功能一个接一个地很好，但是我需要选择和删除多行的能力.我对//.removeClass('row_selected');进行了注释，因此用户可以在视觉上选择多于一行，但是这些行一次只能删除一行.有想法吗? https://datatables.net/release-datatables/examples/api/select_single_row.html

I am using an example from Datatables to delete rows from a table. This works fine, one by one but I need the ability to select and delete multiple rows. I commented the //.removeClass('row_selected'); so the user is visually able to select more than one row, but still the rows only delete one at a time. Ideas? https://datatables.net/release-datatables/examples/api/select_single_row.html

http://jsfiddle.net/BWCBX/22/

jQuery

var oTable;

$(document).ready(function() {
    /* Add a click handler to the rows - this could be used as a callback */
    $("#example tbody tr").click( function( e ) {
        if ( $(this).hasClass('row_selected') ) {
            $(this).removeClass('row_selected');
        }
        else {
            oTable.$('tr.row_selected')//.removeClass('row_selected');
            $(this).addClass('row_selected');
        }
    });

    /* Add a click handler for the delete row */
    $('#delete').click( function() {
        var anSelected = fnGetSelected( oTable );
        if ( anSelected.length !== 0 ) {
            oTable.fnDeleteRow( anSelected[0] );
        }
    } );

    /* Init the table */
    oTable = $('#example').dataTable( );
} );


/* Get the rows which are currently selected */
function fnGetSelected( oTableLocal )
{
    return oTableLocal.$('tr.row_selected');
}*

推荐答案

这将删除多行...

$('#delete').click( function() {
    var anSelected = fnGetSelected( oTable );
    $(anSelected).remove();
} );

这比在dataTables中使用内置的delete方法更可取，因为它在一点上发生了很大的变化.最初，它将在删除之间保留行索引，因此您可以删除第1行，然后删除第2行，然后删除第3行，依此类推.然后对其进行了更改，以便可以删除第1行，而第2行将成为 第1行，因此您必须再次删除第1行，依此类推.

This is preferable to using the in-built delete method in dataTables as it changed quite drastically at one point. Initially, it would retain row indexes between deletes, so you could delete row 1, then row 2, then row 3 etc.. It was then changed so that you could delete row 1, and row 2 would become row 1, so you'd have to delete row 1 again etc..

使用上述方法只是直接从表中删除行，这很容易，并且可以随时更改dataTables的版本，从而省去了麻烦.

Using the above method just removes the rows from the table directly, which is much easier and will save you hassle if changing versions of dataTables at any time.

http://jsfiddle.net/BWCBX/23/

http://jsfiddle.net/BWCBX/23/

这篇关于一键删除多个选定的DataTable行?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！