18

の最新バージョンを使用していjQuery datatablesます。データがロードされてデータテーブルに表示された直後に使用できるコールバック関数はありますか?

で実験しているデータテーブルがありIE8ます。私がテストしている 2 セットのデータがあります (一度に 1 つずつ使用します)。JavaScript 配列と、Ajax 呼び出しから取得した一連のデータがあります。を使用してASP.NET MVC 3います。

Ajax 呼び出しからデータを取得する構成:

$('#banks-datatable').dataTable({
     "bProcessing": true,
     "sAjaxSource": '/Administration/Bank/List',
     "aoColumns": [
          { "sTitle": "Engine" },
          { "sTitle": "Browser" },
          { "sTitle": "Platform" },
          { "sTitle": "Version" },
          { "sTitle": "Grade" }
     ],
     "bAutoWidth": false,
     "bFilter": false,
     "bLengthChange": false,
     "iDisplayLength": 10
});

alert('test');

私のデータテーブルがこのようにロードされると、データテーブルが（データなしで）作成され、処理ボックスが表示され、アラートポップアップが表示されます。この時点で、データテーブルは存在しますが、データテーブルにデータがロードされていません。ポップアップが消えたとき (ポップアップの [OK] ボタンをクリックしたとき) にのみ、データがデータテーブルにロードされます。どうしてこれなの？

JavaScript 配列からデータを取得する構成:

var aDataSet = [
     ['Trident', 'Internet Explorer 4.0', 'Win 95+', '4', 'X'],
     ['Trident', 'Internet Explorer 5.0', 'Win 95+', '5', 'C'],
     ['Trident', 'Internet Explorer 5.5', 'Win 95+', '5.5', 'A'],
     ['Trident', 'Internet Explorer 6', 'Win 98+', '6', 'A'],
     ['Trident', 'Internet Explorer 7', 'Win XP SP2+', '7', 'A'],
     ['Trident', 'AOL browser (AOL desktop)', 'Win XP', '6', 'A'],
     ['Gecko', 'Firefox 1.0', 'Win 98+ / OSX.2+', '1.7', 'A']
];

$('#banks-datatable').dataTable({
     "aoColumns": [
          { "sTitle": "Engine" },
          { "sTitle": "Browser" },
          { "sTitle": "Platform" },
          { "sTitle": "Version" },
          { "sTitle": "Grade" }
     ],
     "bAutoWidth": false,
     "bFilter": false,
     "bLengthChange": false,
     "iDisplayLength": 10,
     "aaData": aDataSet
});

alert('test');

データテーブルが作成され、データが読み込まれ、ポップアップ表示のみが行われます。これは最初のシナリオとは異なります。これはなぜですか？

最初のシナリオを使用する場合、データテーブルが作成されてデータがロードされた時期を判断できる方法はありますか?

このチェックでは、データをロードする方法を問わず使用できるように、一般的なものにしたいと考えています。

4

6 に答える 6

16

機能を使用できますfnDrawCallback。テーブルが描画されるたびに呼び出されます。これには、テーブルにデータがロードされたとき、並べ替えられたとき、またはフィルター処理されたときが含まれます。

于 2012-06-13T15:34:08.633 に答える
8

jQuery DataTable の新しいバージョンでは、メソッドが呼び出されます。initComplete()

于 2015-11-25T13:50:03.533 に答える
4

Datatable は InitComplete オプションを提供します。あなたはそれを使用することができます。それが役立つかもしれません

$('#example').DataTable({
  "initComplete": function(){
    alert('Data loaded successfully');
  }
});

リンク -> https://datatables.net/reference/option/initComplete

于 2018-12-11T12:49:27.610 に答える
2

私は常にJavaScriptがシングルスレッドであることを知っていました。これをサポートする投稿は次のとおりです。

JavaScript はシングルスレッドであることが保証されていますか?

最初のシナリオでは、サーバーからデータを取得し、アラート ボックスでスレッドを保持しています。2 番目のシナリオでは、データを事前入力します。それが違いだと思います。

このページでは、成功時にコールバックを呼び出す方法を示します。

 // POST data to server
 $(document).ready(function() {
   $('#example').dataTable( {
     "bProcessing": true,
     "bServerSide": true,
     "sAjaxSource": "xhr.php",
     "fnServerData": function ( sSource, aoData, fnCallback ) {
       $.ajax( {
         "dataType": 'json',
         "type": "POST",
         "url": sSource,
         "data": aoData,
         "success": fnCallback
       } );
     }
   } );
 } );
于 2012-06-13T15:35:31.633 に答える
0

オーバーロードされるべきではないため、「成功」の代わりに dataSrc を使用することもできます。

ここでは、datatables.net の典型的な例を示します。

var table = $('#example').DataTable( {
    "ajax": {
            "type" : "GET",
            "url" : "ajax.php",
            "dataSrc": function ( json ) {
                //Make your callback here.
                alert("Done!");
                return json.data;
                }       
            },
    "columns": [
            { "data": "name" },
            { "data": "position" },
            { "data": "office" },
            { "data": "extn" },
            { "data": "start_date" },
            { "data": "salary" }

        ]
    } );
于 2014-08-05T15:47:11.517 に答える