2012-07-24 68 views
0

我使用jqGrid来显示一个表。如果数据是local,它工作正常,但如果以JSON格式提供,则不会显示数据。只是另一个不会显示JSON数据的jqGrid

我搜索了很多,但没有一个sulnce可以解释我的问题。有什么建议吗?

的Javascript:

jQuery("#gpaTable").jqGrid({ 
    url: "data.html", 
    datatype: "json", 
    pager: "#gpaPager", 
    height: "100%", 
    colNames: [ 
     "star", 
     "id", 
     "name", 
     "gpa", 
     "tag", 
     "failCnt", 
     "lowScore", 
     "noScore"], 
    colModel: [{ 
     name: "star", 
     index: "star", 
     width: 20 
    }, 
    { 
     name: "id", 
     index: "id", 
     width: 80 
    }, 
    { 
     name: "name", 
     index: "name", 
     width: 80 
    }, 
    { 
     name: "gpa", 
     index: "gpa", 
     width: 40, 
     sorttype: "float" 
    }, 
    { 
     name: "noScore", 
     index: "noScore", 
     width: 80, 
     sorttype: "int" 
    }, 
    { 
     name: "lowScore", 
     index: "lowScore", 
     width: 80, 
     sorttype: "int" 
    }, 
    { 
     name: "failCnt", 
     index: "failCnt", 
     width: 60, 
     sorttype: "int" 
    }, 
    { 
     name: "tag", 
     index: "tag", 
     width: 300 
    }], 
    multiselect: true, 
    caption: "GPA", 
    viewrecords: true, 
    jsonReader: { 
     repeatitems: false, 
     id: "lineId", 
     cell: "cell", 
     root: "rows", 
     records: "records", 
     total: "pageTotal", 
     page: "pageId" 
    } 
}); 

data.html:

{ 
"total": 1, 
"page": 1, 
"records": 1, 
"pageId": 1, 
"pageTotal": 1, 
"rows": [{ 
    "lineId": 1, 
    "cell": { 
     "star": "", 
     "id": "5090379054", 
     "name": "BBB", 
     "gpa": "2.6", 
     "tag": "", 
     "failCnt": 2, 
     "lowScore": 0, 
     "noScore": 2 
    } 
}, 
{ 
    "lineId": 2, 
    "cell": { 
     "star": "", 
     "id": "5090379051", 
     "name": "BBB", 
     "gpa": "2.1", 
     "tag": "", 
     "failCnt": 2, 
     "lowScore": 0, 
     "noScore": 2 
    } 
}, 
{ 
    "lineId": 3, 
    "cell": { 
     "star": "", 
     "id": "5090379052", 
     "name": "CCC", 
     "gpa": "3.5", 
     "tag": "<ul class='tagClass'><li>Tag3</li><li>Tag4</li><li>Tag5</li><li>Tag6</li></ul>", 
     "failCnt": 0, 
     "lowScore": 70, 
     "noScore": 0 
    } 
}, 
{ 
    "lineId": 4, 
    "cell": { 
     "star": "<span class='ui-icon ui-icon-star' value='starred' />", 
     "id": "5090379032", 
     "name": "DDD", 
     "gpa": "1.5", 
     "tag": "", 
     "failCnt": 1, 
     "lowScore": 90, 
     "noScore": 5 
    } 
}, 
{ 
    "lineId": 5, 
    "cell": { 
     "star": "<span class='ui-icon ui-icon-star' value='starred' />", 
     "id": "5090379032", 
     "name": "EEE", 
     "gpa": "1.2", 
     "tag": "<ul class='tagClass'><li>Tag3</li></ul>", 
     "failCnt": 4, 
     "lowScore": 120, 
     "noScore": 2 
    } 
}] 
} 

回答

0

我使用$ .MAP方法做了类似的东西。这里是我的AJAX POST的一个片段,它接收一个映射到“item”的JSON对象,该对象是我的插件期望的,它显示接收到的数据(不是我的情况下的网格,但概念上相同)。

$.ajax({ 
      type: "POST", 
      url: '/Venues/GetVenuesJSON', 
      dataType: "json", 
      data: JSON.stringify(jsonToSend1), 
      contentType: "application/json; charset=utf-8", 
      success: function (data) { 
       response($.map(data, function (item) { 
        return { 
         success: item.success, 
         label: item.label, 
         value: item.label, 
         id: item.value 
        } 
       })); 
      },