jquery - データテーブルの行を選択

Question

私はjqueryでデータテーブルを作成しています：

$('#collectionsList').dataTable( {
    "bJQueryUI": true,
    "bPaginate" : false,
    "bFilter": false,
    "oTableTools": {
        "sRowSelect": "multi"
    },

    "sAjaxSource": serverServicesHandler.get("getCollections"),
        "fnInitComplete" : function(oSettings, json){
    }
})

クリックしたときに行を選択したい。

追加した：

"oTableTools": {
    "sRowSelect": "multi"
}

しかし、それは機能しません。なんで？

Answer 1

これは次のように実行できます。

 oTable = $('#collectionsList').dataTable( ....);

 $('#collectionsList tbody tr').live('click', function (event) {        
 var aData = oTable.fnGetData(this); // get datarow
 if (null != aData)  // null if we clicked on title row
 {
        //now aData[0] - 1st column(count_id), aData[1] -2nd, etc. 
 }});

Answer 2

TableToolsを機能させる.dataTables.sDomには、文字列に「T」を設定して含める必要があります。このようなもの：

$('#example').dataTable({
        sDom: 'T<"clear">lfrtip',
        oTableTools: {
            "sRowSelect": "multi"
        }
});

Answer 3

選択した行を表示するには、次の行でこのクリック関数を使用します。

$('body').on("click",'#collectionsList tbody tr',function() {
  if ($(this).hasClass('row_selected')) 
    $(this).removeClass('row_selected'); // select or deselect row
  else {
    /* I don't put this line below
    //---> $(this).siblings('.row_selected').removeClass('row_selected');
    */
    $(this).addClass('row_selected'); // add selected row
  }
  var aData = oTable.fnGetData(this); // get tha data array from columns
  var col0 = aData[0];  // get the first column value
  var col1 = aData[1];  // get the second column value
  var rowsID=this.id; // rowsID is your id of <tr>
});