jqGrid与ASP.NET MVC基础知识显示没有数据

Question

我已经有大约3试图学习jqGrid。每一次都失败了。所以这次我试着从基础开始。我想要做的就是在http://trirand.com/blog/jqgrid/jqgrid.html处复制json数据示例。

我的最大努力是在每个单元格都有一个行和列的表格中有一个非破坏性空间。

在我的代码中，我只是稍微偏离了该示例中的代码，以说明我没有从相同的数据服务中获取数据。但是我得到了与使用提琴手提取json相同的数据。

的代码是：

function getData() { 

    var obj = 
    { 
     "page": "1", 
     "total": 2, 
     "records": "13", 
     "rows": [{ 
      "id": "13", 
      "cell": ["13", 
      "2007-10-06", 
      "Client 3", 
      "1000.00", 
      "0.00", 
      "1000.00", 
      null] 
     }, 
     { 
      "id": "12", 
      "cell": ["12", 
      "2007-10-06", 
      "Client 2", 
      "700.00", 
      "140.00", 
      "840.00", 
      null] 
     }, 
     { 
      "id": "11", 
      "cell": ["11", 
      "2007-10-06", 
      "Client 1", 
      "600.00", 
      "120.00", 
      "720.00", 
      null] 
     }, 
     { 
      "id": "10", 
      "cell": ["10", 
      "2007-10-06", 
      "Client 2", 
      "100.00", 
      "20.00", 
      "120.00", 
      null] 
     }, 
     { 
      "id": "9", 
      "cell": ["9", 
      "2007-10-06", 
      "Client 1", 
      "200.00", 
      "40.00", 
      "240.00", 
      null] 
     }, 
     { 
      "id": "8", 
      "cell": ["8", 
      "2007-10-06", 
      "Client 3", 
      "200.00", 
      "0.00", 
      "200.00", 
      null] 
     }, 
     { 
      "id": "7", 
      "cell": ["7", 
      "2007-10-05", 
      "Client 2", 
      "120.00", 
      "12.00", 
      "134.00", 
      null] 
     }, 
     { 
      "id": "6", 
      "cell": ["6", 
      "2007-10-05", 
      "Client 1", 
      "50.00", 
      "10.00", 
      "60.00", 
      ""] 
     }, 
     { 
      "id": "5", 
      "cell": ["5", 
      "2007-10-05", 
      "Client 3", 
      "100.00", 
      "0.00", 
      "100.00", 
      "no tax at all"] 
     }, 
     { 
      "id": "4", 
      "cell": ["4", 
      "2007-10-04", 
      "Client 3", 
      "150.00", 
      "0.00", 
      "150.00", 
      "no tax"] 
     }], 
     "userdata": { 
      "amount": 3220, 
      "tax": 342, 
      "total": 3564, 
      "name": "Totals:" 
     } 
    } 

    return obj; 
} 

$(function() { 
    $("#list2").jqGrid({ 
     data: getData()['rows'], 
     datatype: "local",   
     colNames: ['Inv No', 'Date', 'Client', 'Amount', 'Tax', 'Total', 'Notes'], 
     colModel: [ 
      { name: 'id', index: 'id', width: 55 }, 
      { name: 'invdate', index: 'invdate', width: 90 }, 
      { name: 'name', index: 'name asc, invdate', width: 100 }, 
      { name: 'amount', index: 'amount', width: 80, align: "right" }, 
      { name: 'tax', index: 'tax', width: 80, align: "right" }, 
      { name: 'total', index: 'total', width: 80, align: "right" }, 
      { name: 'note', index: 'note', width: 150, sortable: false } 
     ], 
     rowNum: 10, 
     rowList: [10, 20, 30], 
     pager: '#pager2', 
     sortname: 'id', 
     viewrecords: true, 
     sortorder: "desc", 
     caption: "JSON Example" 
    }); 
    $("#list2").jqGrid('navGrid', '#pager2', { edit: false, add: false, del: false }); 

}); 

谁能帮我打破我真的不好跑这个流行的JavaScript库？

Answer 1

我没有发现你的网格有什么问题。你的数据有问题。我希望你的数据需要检查。此外，如果你使用的是当地为您的数据类型，数据应该像下面，

var mydata = [ 
{ id: "11", invdate: "2007-10-06", name: "Client 1", amount: "600.00" 
, tax:"120.00", total:"720.00", note: null }, 
{ id: "12", invdate: "2007-10-06", name: "Client 2", amount: "700.00", 
    tax:"140.00", total:"840.00", note: null }, 
{ id: "13", invdate: "2007-10-06", name: "Client 3", amount: "1000.00", 
    tax:"0.00", total:"1000.00", note: null } 
    ]; 

这Demo会给你美好的开始jqGrid的。我已经使用了你的网格定义。希望这可以帮助。