Question

我正在尝试使用jqGrid绑定JSON数据，但网格为空。我的代码错了吗？

脚本：

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

    <script type="text/javascript">
    var data = '{ "employees" : [' +
                '{ "firstName":"John" , "lastName":"Doe" },' +
                '{ "firstName":"Anna" , "lastName":"Smith" },' +
                '{ "firstName":"Peter" , "lastName":"Jones" } ]}';

      $("#grid").jqGrid({
        datatype: 'json',
        colModel:[
          {name:'firstName', label: 'First name', width: 300},
          {name:'lastName', label: 'Last Name', width: 200}
        ],
        caption: "ReportingEmployees",
        pager : '#pager',
        height: 'auto'
      }).navGrid('#pager', {edit:false,add:false,del:false, search: false});
    </script>

Answer 1

您需要将以下格式的json数据而不是文本传递给jqGrid函数，并将datatype设置为local，因为没有api / url调用。

var myData = [{ "firstName":"John" , "lastName":"Doe" },
                { "firstName":"Anna" , "lastName":"Smith" },
                { "firstName":"Peter" , "lastName":"Jones" }];

      $("#grid").jqGrid({
        data: myData,//pass data here
        datatype: 'local',//set datatype to local
        colModel:[
          {name:'firstName', label: 'First name', width: 300},
          {name:'lastName', label: 'Last Name', width: 200}
        ],
        caption: "ReportingEmployees",
        pager : '#pager',
        height: 'auto'
      }).navGrid('#pager', {edit:false,add:false,del:false, search: false});

<强> JSFiddle Demo

注意： - 请确保您已将js文件与jQuery lib一起包含在

中

grid.locale-en.js
jquery.jqGrid.min.js

使用jqGrid数据类型JSON不可见数据

1 个答案: