0

jquery データテーブルとサーバー側処理を UI コンポーネントの 1 つに統合しようとしています。リクエスト URL は json を返します。JSON は整形式であり、jsonlint の検証に合格します。

これは、firebug から取得された典型的な json 応答です。

{
    "sEcho": 1,
    "iTotalRecords": 6416,
    "iTotalDisplayRecords": 5,
    "aaData": [
        {
            "0": 421367,
            "1": "Test1",
            "2": "NEW",
            "3": "Default",
            "4": "18 Aug 2011 20:27:12 GMT",
            "5": "TestBench",
            "6": "NA"
        },
        {
            "0": 421368,
            "1": "Test2",
            "2": "NEW",
            "3": "Default",
            "4": "18 Aug 2011 20:27:12 GMT",
            "5": "TestBench",
            "6": "NA"
        },
        {
            "0": 421369,
            "1": "Test3",
            "2": "NEW",
            "3": "Default",
            "4": "18 Aug 2011 20:27:12 GMT",
            "5": "TestBench",
            "6": "NA"
        },
        {
            "0": 421370,
            "1": "Test4",
            "2": "NEW",
            "3": "Default",
            "4": "18 Aug 2011 20:27:13 GMT",
            "5": "TestBench",
            "6": "NA"
        },
        {
            "0": 421371,
            "1": "Test5",
            "2": "NEW",
            "3": "Default",
            "4": "18 Aug 2011 20:27:13 GMT",
            "5": "TestBench",
            "6": "NA"
        }
    ]
} 

脚本:

 $(document).ready(function() {
   var thisTable;  
    thisTable = $('#events').dataTable( {
      "bProcessing": true,
      "bServerSide": true,
      "bJQueryUI": true,
      "sPaginationType": "full_numbers",
      "sAjaxSource": "http://localhost:9000/dt/data/all"
    });
  });

画面に処理ウィンドウが表示され、停止しません。テーブルはまだ空です。

ここで何か不足していますか?

それはsEchoの問題ですか?処理ウィンドウ全体を見ているので。

4

2 に答える 2

2

私は同じ問題を抱えていました。つまり、処理メッセージは停止しませんが、投稿応答にはエラーがありませんでした。POSTデータを確認しましたが、ページ番号を変更した後、ブラウザがサーバーsEcho = 2に送信した後(ページ2をクリックした場合)、サーバー側のコードがまだブラウザsEcho = 1に送信されたため、間違いが発生しました。リクエスト パラメータから正しい sEcho 値を取得し、それを json 応答データに入れましたが、今では正常に動作します!!

文字列 sEcho =request.getParameter("sEcho");

于 2013-03-28T10:59:29.317 に答える
1

あなたの設定は配列の配列を期待していると思います。あなたはデータがオブジェクトの配列です。したがって、「aoColumns」オプションを使用する必要があります(http://www.datatables.net/release-datatables/examples/ajax/objects.html

だから私はそれがこのようなものでなければならないと思います:

$(document).ready(function() {
    var thisTable;  
    thisTable = $('#events').dataTable( {
        "bProcessing": true,
        "bServerSide": true,
        "bJQueryUI": true,
        "sPaginationType": "full_numbers",
        "sAjaxSource": "http://localhost:9000/dt/data/all"
        "aoColumns": [
            { "mData": "0" },
            { "mData": "1" },
            { "mData": "2" },
            { "mData": "3" },
            { "mData": "4" },
            { "mData": "5" },
            { "mData": "6" },
        ]
    });
});

このフィドルは私にとってはうまくいくようです(ただし、アクセスできないURLを想定しているため、sAjaxSourceプロパティをテストできません)http://jsfiddle.net/thomasjonas/jW7uC/1/

于 2013-02-12T10:20:44.167 に答える