多行选择

时间:2015-09-25 13:38:11

标签: jquery datatables

我正在使用jQuery DataTables并且在选择多行时遇到问题。

我已按照link的说明进行了操作。一些行是可选择的,而其他行则不会被选中。控制台中没有错误。

这是我的代码:

$(document).ready(function () {

        var selected = [];

        $('#myTable').dataTable({


            "aaSorting": [ ], // Prevent initial sorting
            "sAjaxSource": "getList",
            "sAjaxDataProp": "",
            "sServerMethod" : "POST",
            "bProcessing": true,
            "fnServerParams": function ( aoData ) {
                    aoData.push( { "name": "param", "value": "paramValue"} );
             },
             "rowCallback": function( row, data ) {
                if ( $.inArray(data.packetId, selected) !== -1 ) {
                    $(row).addClass('selected');
                }
              },
             "aoColumns": [
                    { "mData": "packetId"},
                    { "mData": "packetName" }
             ]
        });

        $('#myTable tbody').on('click', 'tr', function () {
            var id = this.id;
            var index = $.inArray(id, selected);

            if ( index === -1 ) {
                selected.push( id );
            } 
            else {
                selected.splice( index, 1 );
            }

            $(this).toggleClass('selected');
        } );
    });

1 个答案:

答案 0 :(得分:2)

  

<强>原因

显然你没有返回DT_RowId字段。来自description

  

Demo使用分配给TR元素的唯一ID(这是通过使用作为服务器为每行指定的对象的一部分返回的DT_RowId特殊属性自动完成的),以跟踪选择哪些行并且在抽签中重新选择它们。

  

<强>解

替换此行:

var id = this.id;

使用以下代码:

var data = $('#myTable').DataTable().row(this).data();
var id = data.packetId;
  

备注

请注意,Select扩展程序更易于使用,请参阅以下代码:

$('#example').DataTable( {
    select: {
        style: 'multi'
    }
} );

但是,您需要为扩展程序包含其他JS文件。

请参阅this example进行演示。