0

サーバーからのデータをjqGridに表示しようとしています。データを取得するのに問題なく動作しますが、何も表示されません。

これが私のコードです:

HTML

<link href="css/jqGrid.css" rel="stylesheet" media="screen"/>
<script src="js/jquery.min.js"></script>
<script src="js/jquery.jqGrid.min.js"></script>

<table id="mapGrid"></table>
<div id="mapGridPager"></div>

JS

function initGrid() {

    var gridOption = {
        caption: 'Locations',
        url: 'report/search?',
        height: '500', 
        width: '500', 
        colNames:['Event ID', 'DateTime','Latitude', 'Longitude', 'Address'], 
        colModel:[ {name:'eventId', index:'eventId', align:'center',    width:40, fronzen:true}, 
                   {name:'timestamp',index:'timestamp', align:'center', width:100, fronzen:true},   
                   {name:'latitude',index:'latitude', width:100},
                   {name:'longitude',index:'longitude', width:100},
                   {name:'address',index:'address', width:200}
                   ], 
        emptyrecords: 'Nothing to display',
        rowNum:30, 
        mtype: "GET", 
        rownumbers: true, 
        gridview: true, 
        page : 1,
        pager: '#mapGridPager', 
        sortname: 'eventId', 
        viewrecords: true, 
        sortorder: "asc", 
        shrinkToFit: false,
        beforeRequest: function(){
            return false;
        }
    };

    $('#mapGrid').jqGrid(gridOption)
                 .navGrid(gridOption.pager,    {edit:false,add:false,del:false,refresh:false,search:false});

}

JSON データ

{
    "total":1,
    "page":1,
    "records":22,
    "rows":[
        {
            "eventId":1,
            "accountId":"demo",
            "deviceId":"demo",
            "timestamp":"16-01-1970 02:20:25",
            "statusCode":61714,
            "latitude":38.4465157985687,
            "longitude":-121.857991218567,
            "altitude":19.0,
            "address":"Dixon, CA"
        },
       //21 more
    ]
}

各レコードのイベント ID は一意です。

この問題を解決するにはどうすればよいですか?

4

2 に答える 2

0

Jqgrid のデフォルトのデータ型は XML です。データのデータ型を明示的に言及する必要があります。以下のオプションを追加すると、グリッドが表示されます。

データ型: "json".

Jqgrid はテーマに Jquery UI css を使用するため、Jquery-Ui.css とテーマも追加してルック アンド フィールを向上させます。

于 2013-04-26T02:20:13.217 に答える
0

datatype: 'json',jqGrid セットアップの一部として追加します。

また、この Javascript がある時点で呼び出されると想定しています。

于 2013-04-26T02:16:22.057 に答える