1

私はdatatables 1.9 jqueryプラグインを使い始めたばかりですが、サーバー側からdatatables設定を取得しようとしています。私のデータテーブルコードは次のとおりです。

$.ajax({
        type: "POST",
        url: "./viewController",
        data:{ "TableName" : "ViewGridDept",
        "Call" : "gridConfiguration"},
        dataType:"json",
        success: function(data){
        //columns=data.aoColumns;
        var coldata = eval( '('+data+')' );
        alert(coldata.aoColumns);
        employeeTable = $("#EmployeeTable").dataTable({
        "bJQueryUI" : true,
        "sPaginationType" : "full_numbers",
        "bFilter": true,
        "bInfo": true,
        "bServerSide": true,
        "sAjaxSource" : "./viewController",
        "aoColumns":coldata.aoColumns ,
        "aoColumnDefs":coldata.aoColumnsRef,
        "fnServerData": function ( sSource, aoData, fnCallback ) {
            aoData.push( { "name" : "TableName", "value" : "ViewGridDept" },
            { "name" : "Call", "value" : "Data" } );
            $.ajax( {
                    "dataType": 'json', 
                    "type": "POST", 
                    "url": sSource, 
                    "data": aoData, 
                    "success": fnCallback
                    } );}

サーバー側からの私のjsonは

{"aoColumns":[{"mDataProp":"deptName","sTitle":"Department Name"},{"mDataProp":"deptId","sTitle":"Department Id"}],"aoColumnsRef":[{"aTarget":["2"]},{"aTarget":["1"]}]}

しかし、私のデータテーブルはデータをロードしていません。私の質問は、ネストされたjsonをデータテーブルに使用する方法です"aoColumns":coldata.aoColumns , "aoColumnDefs":coldata.aoColumnsRef,

4

2 に答える 2

2

サーバーからの返信は、データテーブルが期待するような整形式ではありません。

サーバーからの応答

DataTables がサーバーに対して行う情報の各要求に応答して、次のパラメーターを使用して整形式の JSON オブジェクトを取得することを想定しています。

int iTotalRecords フィルタリング前の総レコード数 (つまり、データベース内の総レコード数)

int iTotalDisplayRecords フィルタリング後の合計レコード (つまり、フィルタリングが適用された後のレコードの総数 - この結果セットで返されるレコードの数だけではありません)

string sEcho クライアント側から送信された sEcho の変更されていないコピー。このパラメーターは描画ごとに変化します (基本的には描画回数です)。そのため、これを実装することが重要です。セキュリティ上の理由から、クロス サイト スクリプティング (XSS) 攻撃を防ぐために、このパラメーターを整数に「キャスト」することを強くお勧めします。

string sColumns 非推奨 オプション - これは、表示に必要な場合に DataTables がクライアント側でデータを並べ替えることができるようにする、カンマで区切られた (sName と組み合わせて使用​​される) 列名の文字列です。返される列名の数は、テーブル内の列の数と正確に一致する必要があることに注意してください。より柔軟な JSON 形式については、mData の使用を検討してください。

array aaData 2D 配列のデータ。このパラメータの名前は sAjaxDataProp で変更できることに注意してください。

ここでその情報を見つけることができますhttp://www.datatables.net/usage/server-side

于 2013-08-29T13:24:26.643 に答える
1

string sColumns Deprecated Optional がその問題の主な原因です。現在、作業コードは次のとおりです。

$(document).ready(function() {
var columns;
$.ajax({
        type: "POST",
        url: "./viewController",
        data:{ "TableName" : "ViewGridDept",
        "Call" : "gridConfiguration"},
        dataType:"json",
        success: function(coldata){
        //columns=data.aoColumns;
        //var coldata = eval( '('+data+')' );
        alert(coldata.aoColumnsRef);
        employeeTable = $("#EmployeeTable").dataTable({
        "bJQueryUI" : true,
        "sPaginationType" : "full_numbers",
        "bFilter": true,
        "bInfo": true,
        "bServerSide": true,
        "sAjaxSource" : "./viewController",
        //"aoColumns":coldata.aoColumns ,
        "aoColumnDefs":coldata.aoColumnsRef,
        //"aoColumnDefs":[{"sTitle":"Department Name","mDataProp":"deptName","aTargets":"[1]"},{"sTitle":"Department ID","mDataProp":"deptId","aTargets":"[0]"}],
        "fnServerData": function ( sSource, aoData, fnCallback ) {
            aoData.push( { "name" : "TableName", "value" : "ViewGridDept" },
            { "name" : "Call", "value" : "Data" } );
            $.ajax( {
                    "dataType": 'json', 
                    "type": "POST", 
                    "url": sSource, 
                    "data": aoData, 
                    "success": fnCallback
                    } );}

});
        }

});

最初のリクエストの json は次のようになります。

{"aoColumnsRef":[{"aTargets":[1],"mDataProp":"deptName","sTitle":"Department Name","bVisible":true,"bSearchable":true},{"aTargets":[0],"mDataProp":"deptId","sTitle":"Department Id","bVisible":true,"bSearchable":false}]}

この問題に直面している人々に役立つことを願っています。

于 2013-08-30T07:00:07.140 に答える