3

次の方法でデータをjqgridにロードします.jsonデータをjqgridにロードできません.jsonをmydata=json.parse（jsondata）のように配列に解析します。次にこの配列（mydata）をバインドしますデータ型を使用してjqgridに： "local" .myの質問は、jsonデータをjqgridにバインドする方法ですか？ 

         $("#datagrid").jqGrid({

                    datatype: "local", 
                    data: mydata,
                    colNames:['companyid','company', 'price', 'Change','perchange','LastUpdated'],
                    colModel:[
                        {name:'companyid',index:'companyid', width:100,editable:true,editoptions:{size:10}},
                        {name:'company',index:'company', width:100,editable:true},
                        {name:'price',index:'price', width:100,editable:true,editoptions:{size:10}},
                        {name:'Change',index:'Change', width:100,editable:true,editoptions:{size:25}},
                        {name:'perchange',index:'perchange', width:100, align:"right",editable:true,editoptions:{size:10}},
                        {name:'LastUpdated',index:'LastUpdated', width:200, align:"right",editable:true,editoptions:{size:10}}
                    ],
                    rowNum:10,
                    rowList:[3,6],
                    loadonce: true,
                    pager: '#navGrid',
                    sortname: 'companyid',
                    sortorder: "asc", 
                    height: 210,
                    width:600,
                    onSelectRow: function(id)
                                 {
                                    getID = jQuery("#datagrid").jqGrid('getCell', id, 'companyid')
                                 },
                    viewrecords: true,
                    caption:"JQ GRID"
                });

JSON形式：

    [
        {
            "company": "test",
            "price": 98,
            "Change": 8,
            "perchange": 8,
            "LastUpdated": "2",
            "companyid": 2
        },
        {
            "company": "test123",
            "price": 1,
            "Change": 1,
            "perchange": 1,
            "LastUpdated": "1",
            "companyid": 3
        },
        {
            "company": "abc",
            "price": 1234,
            "Change": 123,
            "perchange": 1,
            "LastUpdated": "1",
            "companyid": 1
        }
    ]
4

1 に答える 1

7

まずid、入力データの行を定義する必要があります。すべての行のid属性（<tr>）は、対応する値に設定されます。すでにcompanyidどちらがその役割を果たすことができるかを知っているので、の列key: trueのプロパティに追加するだけで十分です。"companyid"colModel

サーバーからの日付の直接ロード（ファイルからのロードを含む）の問題はjsonReader、入力データの形式を記述するものを追加することで解決できます。を使用するためloadonce: true、total入力データrecordsのプロパティは無視され、次の簡単な形式でpage使用できます。jsonReader

jsonReader: {repeatitems: false, root: function (obj) { return obj; }}

対応するデモはこちらです。

コードを投稿したデータの配列からデータをロードする必要がある場合は、直接機能するはずです（別のデモを参照）。JSONデータの解析で使用に他の問題があると思いますが、対応するコードを投稿していません。

idとについてのアドバイスkey: trueはまだ行われています。localReader: {id: "companyid"}代わりに、2番目のケースと同じプロパティid: "companyid"に使用できますjsonReader。key: trueコードは読みやすく、使用するリーダーから独立しているため、個人的には使用することを好みます。

于 2012-09-05T12:19:30.927 に答える