すべてのチェックボックスデータテーブルトリガーを選択

Question

私は現在この問題を数日間苦労しています。問題は、何かをトリガーするためのデータテーブルのselect allチェックボックスの「クリック」をどうすればできますか（この場合、ボタンの「無効」クラス）ですか？

ユーザーがチェックボックスを1つずつクリックするとトリガーが動作しますが、[すべてを選択]チェックボックスをオンにすると機能しません。私を助けてください、お元気ですか。

これは私のDataTableスクリプトです：

$(document).ready(function() { 
      table = $('#em').DataTable({ 
       "scrollY": "45vh", 
       "scrollX": true, 
       "scrollCollapse": true, 
       "paging": false, 

       "responsive": true, 

       "aaSorting": [1, 'desc'], 
       "iDisplayLength": 5, 
       "ajax": { 
        "url": "/Eromo_Web/inv?act=getAll", 
        "type": "POST", 
        "dataSrc": "" 
       }, 
       "columnDefs": [ 
        { 
         'targets': 0, 
         'checkboxes': { 
          'selectRow': true 
         } 
        } 
       ], 
       "columns": [ 
        {"data": null}, 
        {"data": "CODE"}, 
        {"data": "TYPE"}, 
        {"data": "NAME"}, 
        {"data": "KIND"}, 
        {"data": "MERK"}, 
        {"data": "MODEL_TYPE"}, 
        {"data": "LOC"}, 
        {"data": "BUY_DATE"}, 
        {"data": "USERNAME"}, 
        {"data": "DESCR"}, 
        {"data": "RFRGRNT"}, 
        {"data": "MANF"}, 
        {"data": "COUNTRY"} 
       ] 
      }); 

私の現在のクリックトリガー：

//getting ID on checkbox click 
      $('#em').on('change', null, function() { 
       if (table.column(0).checkboxes.selected().length > 0) { 
        $('#generateqrcode').attr('disabled', false); 
       } else { 
        $('#generateqrcode').attr('disabled', true); 
       } 
       if (table.column(0).checkboxes.selected().length === 1) { 
        ID = ""; 
        $.each(table.column(0).checkboxes.selected(), function (key, value) { 
         ID = value["CODE"]; 
        }); 
        $('#update').attr('disabled', false); 
        $('#delete').attr('disabled', false); 
       } else { 
        $('#update').attr('disabled', true); 
        $('#delete').attr('disabled', true); 
       } 
      }); 

Answer 1

ありがとうございます。遅く返事を申し訳ありませんが、私は問題が見つかりました。それはプロパティー"scrollY": "45vh",と"scrollX": trueを使用しているからです。それを無効にすると、「selectAll」チェックボックスを簡単に起動できます。私はなぜthoを知らない。

table = $('#em').DataTable({ 
       "ajax": { 
        "url": "/Eromo_Web/inv?act=getAll", 
        "type": "POST", 
        "dataSrc": "" 
       }, 
       "columnDefs": [ 
        { 
         'targets': 0, 
         'checkboxes': { 
          'selectRow': false 
         } 
        } 
       ], 
       "columns": [ 
        {"data": null}, 
        {"data": "CODE"}, 
        {"data": "TYPE"}, 
        {"data": "NAME"}, 
        {"data": "KIND"}, 
        {"data": "MERK"}, 
        {"data": "MODEL_TYPE"}, 
        {"data": "LOC"}, 
        {"data": "BUY_DATE"}, 
        {"data": "USERNAME"}, 
        {"data": "DESCR"}, 
        {"data": "RFRGRNT"}, 
        {"data": "MANF"}, 
        {"data": "COUNTRY"} 
       ], 
       "paging": false, 
       "responsive": true, 
       "aaSorting": [1, 'desc'], 
       "iDisplayLength": 5 
      }); 

そして、この：

//    getting ID on checkbox click 
       $('#em').on('change', null, function() { 
        if (table.column(0).checkboxes.selected().length > 0) { 
         $('#generateqrcode').attr('disabled', false); 
        } else { 
         $('#generateqrcode').attr('disabled', true); 
        } 
        if (table.column(0).checkboxes.selected().length === 1) { 
         ID = ""; 
         $.each(table.column(0).checkboxes.selected(), function (key, value) { 
          ID = value["CODE"]; 
         }); 
         $('#update').attr('disabled', false); 
         $('#delete').attr('disabled', false); 
        } else { 
         $('#update').attr('disabled', true); 
         $('#delete').attr('disabled', true); 
        } 
       }); 

Answer 2

は、以下のコードを試してみてください。

$('#em').on('init.dt', function(){ 
    $('#em thead th input[type="checkbox"]').on('click', function(e) { 
     alert('Clicked on "Select all"'); 
    }); 
}); 

は、コードとデモのためthis exampleを参照してください。

しかし、行選択を使用している場合は、selectとdeselectのイベントを処理することをお勧めします。

$('#example').on('select.dt', function(){ 
    alert('Row selected'); 
}); 

$('#example').on('deselect.dt', function(){ 
    alert('Row deselected'); 
}); 

コードとデモンストレーションについては、this exampleを参照してください。

jQuery DataTables Checkboxesプラグインの今後のリリースでは、すべてのチェックボックスを選択するためのイベント生成を追加します。