0

私はこのコードを使用しています:

    var data = {
            colModel: [
                    { name: 'ID', index: 'id', width: "80" },
                    { name: 'Name', index: 'name', width: "300" },
                    { name: 'Value 1', index: 'value1', width: "110" },
                    { name: 'Value 2', index: 'value2', width: "110" },
                ],
                pager: instance.getPager().attr("id"),
                datatype: "jsonstring",
                datastr: {
                    "page": "5",
                    "total": "16",
                    "records": "400",
                    "rows": [
                          {
                           "id": 0,
                           "name": "name0",
                           "value1": 61,
                           "value2": 81
                       },
                       {
                           "id": 1,
                           "name": "name1",
                           "value1": 91,
                           "value2": 48
                       },
                       {
                           "id": 2,
                           "name": "name2",
                           "value1": 65,
                           "value2": 41
                       },
                       {
                           "id": 3,
                           "name": "name3",
                           "value1": 20,
                           "value2": 49
                       },
                       {
                           "id": 4,
                           "name": "name4",
                           "value1": 34,
                           "value2": 91
                       },
                       {
                           "id": 5,
                           "name": "name5",
                           "value1": 80,
                           "value2": 31
                       },
                       {
                           "id": 6,
                           "name": "name6",
                           "value1": 9,
                           "value2": 37
                       },
                       {
                           "id": 7,
                           "name": "name7",
                           "value1": 41,
                           "value2": 14
                       },
                       {
                           "id": 8,
                           "name": "name8",
                           "value1": 10,
                           "value2": 85
                       },
                       {
                           "id": 9,
                           "name": "name9",
                           "value1": 21,
                           "value2": 9
                       },
                       {
                           "id": 10,
                           "name": "name10",
                           "value1": 67,
                           "value2": 55
                       },
                       {
                           "id": 11,
                           "name": "name11",
                           "value1": 50,
                           "value2": 23
                       },
                       {
                           "id": 12,
                           "name": "name12",
                           "value1": 11,
                           "value2": 92
                       },
                       {
                           "id": 13,
                           "name": "name13",
                           "value1": 52,
                           "value2": 54
                       },
                       {
                           "id": 14,
                           "name": "name14",
                           "value1": 55,
                           "value2": 94
                       },
                       {
                           "id": 15,
                           "name": "name15",
                           "value1": 23,
                           "value2": 98
                       },
                       {
                           "id": 16,
                           "name": "name16",
                           "value1": 5,
                           "value2": 69
                       },
                       {
                           "id": 17,
                           "name": "name17",
                           "value1": 19,
                           "value2": 19
                       },
                       {
                           "id": 18,
                           "name": "name18",
                           "value1": 38,
                           "value2": 60
                       },
                       {
                           "id": 19,
                           "name": "name19",
                           "value1": 21,
                           "value2": 78
                       },
                       {
                           "id": 20,
                           "name": "name20",
                           "value1": 22,
                           "value2": 52
                       },
                       {
                           "id": 21,
                           "name": "name21",
                           "value1": 63,
                           "value2": 33
                       },
                       {
                           "id": 22,
                           "name": "name22",
                           "value1": 51,
                           "value2": 13
                       },
                       {
                           "id": 23,
                           "name": "name23",
                           "value1": 51,
                           "value2": 83
                       },
                       {
                           "id": 24,
                           "name": "name24",
                           "value1": 82,
                           "value2": 13
                       }
                   ]
                },
                jsonReader: { repeatitems: false },
                rowNum: 25,
                viewrecords: true,
                caption: "Packages",
                height: "auto",
                ignoreCase: true
    }; 
    console.log(JSON.stringify(data));
    instance.getContainer().jqGrid(data);

私がやろうとしているのは、サーバーから結果のサブセットを返すことです(ここでは、それらをハードコーディングしました)。ページと合計を指定してページングをシミュレートし、これらをテーブルに表示したいと思います。

テーブルが生成され、行を認識します(行が作成され、テーブルが正しい高さに拡張されます)が、セルは空白です。

また、ページング数は、期待していたページ数とレコード数の合計がそれぞれ16と400になるとは思っていませんでしたが、そうではなく、データ(1と25)と一致しているため、「5/1ページ」が表示されます。および「101-125of25」。

また、jsonReader: { repeatitems: false },欠落しているかtrueに設定されている場合、エラーが発生します。

TypeError: obj is undefined

これはバグですか?私が何か間違ったことをしているのかわからない。

この問題を修正する(少なくとも再現できる)方法を知っている人はいますか?FFとChromeの両方でテスト済み。

ありがとう

アップデート:

問題の一部が修正され(Krisの回答)、テーブルのデータを確認できるようになりました。colModelの名前タグを変更することで修正されました。

ただし、まだいくつかの未解決の問題があります。

  1. 合計ページ数はまだ1として表示されているので、「5/16ページ」と表示します。「5/16ページ」を表示したい
  2. レコードの総数はまだ25と表示されているので、「101-125 of 400」を表示したい場合は、「101-125of25」と表示されます。
  3. 設定時にまだエラーがありますrepeatitems: true

最初の2つの問題は関連していると思います。

4

2 に答える 2

1

colModelにいくつかの名前付けの問題があります(colModelの名前はjsonのキーと完全に同じである必要があります)

変化する

colModel: [
                { name: 'ID', index: 'id', width: "80" },
                { name: 'Name', index: 'name', width: "300" },
                { name: 'Value 1', index: 'value1', width: "110" },
                { name: 'Value 2', index: 'value2', width: "110" },
            ],

 colModel: [
                            { name: 'id', index: 'id', width: "80" },
                            { name: 'name', index: 'name', width: "300" },
                            { name: 'value1', index: 'value1', width: "110" },
                            { name: 'value2', index: 'value2', width: "110" },
                        ],
于 2013-02-28T10:20:52.103 に答える
0

これは、view/htmlページでのグリッド定義です。

    jQuery(document).ready(function() {
    jQuery("#list").jqGrid({
        url: '/Home/DynamicGridData/',
        datatype: 'json',
        mtype: 'GET',
        colNames: ['id', 'name', 'value1', 'value2'],
        colModel: [
                { name: 'ID', index: 'id', width: "80" },
                { name: 'Name', index: 'name', width: "300" },
                { name: 'Value 1', index: 'value1', width: "110" },
                { name: 'Value 2', index: 'value2', width: "110" },
            ],
        pager: jQuery('#pager'),
        rowList: [5, 10, 20, 50],
        jsonReader: { repeatitems: false },
            rowNum: 25,
            viewrecords: true,
            caption: "Packages",
            height: "auto",
            ignoreCase: true
    }).navGrid('#pager', { edit: false, add: false, del: false, refresh: false, search: true });

});

 <table id="list"></table>
 <div id="pager"></div>

次に、サーバーからデータを取得するメソッドを定義する必要があります。上記のグリッドで、URL Home / DynamicGridDataを呼び出します。これが、定義とページングロジックです。

    public ActionResult DynamicGridData(string sidx, string sord, int page, int rows)
    {
        var context = new AdvItemsContext();
        int pageIndex = Convert.ToInt32(page) - 1;
        int pageSize = rows; //this gets you the page size
        int totalRecords = context.db.Count(); //this gets you the totalrecords
        int totalPages = (int)Math.Ceiling((float)totalRecords / (float)pageSize); //this math get the tota pages avaiable

        var dbdata = context.db.ToList().Skip(pageIndex * pageSize).Take(pageSize);// this lets you page through the records

        var jsonData = new
        {
            total = totalPages,
            page = page,
            records = totalRecords,
            rows = new[] {
            new {id=0,cell=new[]{"0","name0","61","81"}},
            new {id=1,cell=new[]{"1","name1","91","48"}},
            new {id=2,cell=new[]{"0","name2","65","41"}},
            // all your other values or better yet get this from server
        }
        };
        return Json(jsonData, JsonRequestBehavior.AllowGet);
    }
于 2013-02-28T16:45:04.073 に答える