2017-02-08 7 views
0

fnServerDataを使用してサーバー側からデータを取得していて、そのデータを列に設定する必要があります。応答は次のとおりです。Datatables - fnServerDataを使用してaoColumnsを設定する

{"sEcho":"1","iTotalRecords":3,"iTotalDisplayRecords":3,"aaData":[["100007_pgsqldb1","0 bytes",null,"06 Hr 46 Min","2790"],["100007-mssqldb1","0 bytes",null,"06 Hr 46 Min","2789"],["100007-mysqldb1","0 bytes",null,"06 Hr 46 Min","2784"]]} 

私のデータテーブルの定義は次のとおりです。

サーバー応答aaDataには5つの値がありますが、最初の4つの値のみを表示します。

答えて

0

aoColumnsプロパティを使用して、使用するマップを正確にマップします。

$('#databases').dataTable({ 
      "bFilter": false, 
      "bSort" : false, 
      "bAutoWidth": false, 
      "bProcessing": true, 
      "bServerSide": true, 
      "sPaginationType": "full_numbers", 
      "sDom": 'frtlpi', 
      "sAjaxSource": searchUrl, 
      "fnServerData": function(sSource, aoData, fnCallback) { 
       $.getJSON(sSource, aoData, function(json) { 
        fnCallback(json); 
       }); 
      }, 
      "aoColumnDefs": [ 
       {"sWidth": "100px", "bSortable": true, "aTargets": [0]}, 
       {"sWidth": "100px", "bSortable": true, "aTargets": [1]}, 
       {"sWidth": "100px", "bSortable": true, "aTargets": [2]}, 
       {"sWidth": "100px", "bSortable": true, "aTargets": [3]} 
      ], 
      "aoColumns": [ 
       { 
        mDataProp: [0], 
        "sClass": "left" 
       }, 
       { 
        mDataProp: [1], 
        "sClass": "left" 
       }, 
       { 
        mDataProp: [2], 
        "sClass": "left" 
       }, 
       { 
        mDataProp: [3], 
        "sClass": "left" 
       } 
      ] 
     }); 

HTML:

<table id="databases"> 
    <thead> 
    <tr> 
     <th>Header1</th> 
     <th>Header2</th> 
     <th>Header3</th> 
     <th>Header4</th>   
    </tr> 
    </thead> 
    <tbody> 
    </tbody> 
</table> 

詳細についてhttp://legacy.datatables.net/usage/columns

+0

ここを参照してください、私はこれを試してみました。しかし、私は "DataTablesの警告:追加されたデータが既知の列数と一致しません"と言っています。 – Yasitha

+0

hi yasitha、答えが更新されました。 – mhshimul

関連する問題