1

如何将简单的 JSON 对象绑定到 jqGrid？

这是我所拥有的：

    var tableSrc = { "page":"1", "total":1, "records":"3", "rows": [
        { "title": "Title1", "subtitle": "subTitle", "authors": ["a1", "a2", "a3"] },
        { "title": "Title2", "subtitle": "subtitle", "authors": ["X", "Y"] },
        { "title": "Title3", "subtitle": "subTitle", "authors": ["1", "2", "3", "4"]}]
    };

    $(".jqGridTarget").jqGrid({
        datastr: tableSrc,
        datatype: "jsonstring",
        colNames: ['title', 'subtitle'],
        colModel: [
            { name: 'title', index: 'title', width: 55 },
            { name: 'subtitle', index: 'subtitle', width: 90}]
    });

接着： 

<table class="jqGridTarget">
</table>

这会产生错误：

未捕获的语法错误，无法识别的表达式：# inside of jQuery 1.6.2

我也尝试过使用 json 而不是 jsonstring 来替换 datastr。这消除了错误，但网格仍然是空的。在这两种情况下 undefined 都会出现，或者在网格体中闪烁。

编辑

我也尝试过 datatype: "local" 与 tableSrc 作为数据。没有错误或未定义，但网格中仍然没有数据。

结束编辑

此外，这里是我引用的脚本/css 文件：

<script type='text/javascript' src='jquery.min.js'></script>
<script type='text/javascript' src='jquery.tmpl.js'></script>
<script type='text/javascript' src='jquery.jqGrid.min.js'></script>
<script type='text/javascript' src='knockout-1.2.1.js'></script>
<link rel="Stylesheet" type="text/css" href="ui.jqgrid.css" />
4

2 回答 2

2

要使您的代码正常工作，需要进行三处更改（请参见此处的固定演示）：

  1. 添加参数 jsonReader: { repeatitems: false }`
  2. 添加和id到<table>元素
  3. 包括i18n/grid.locale-en.js 之前 jquery.jqGrid.min.js

此外，我建议您始终使用gridview: true，并且在大多数情况下定义height为height: 'auto'.

于 2011-08-31T14:42:58.207 回答
1

我想你正在寻找datatype: 'local'and data: tableSrc。

datatype：定义期望在网格中表示数据的信息类型。有效选项是 xml - 我们期望 xml 数据；xmlstring - 我们期望 xml 数据为字符串；json - 我们期望 JSON 数据；jsonstring - 我们期望 JSON 数据为字符串；本地 - 我们期望在客户端定义的数据（数组数据）；javascript - 我们期望 javascript 作为数据；function - 用于检索数据的自定义函数。

data：存储传递给网格的本地数据的数组。如果要加载数组数据，可以直接指向该变量。它可以替代相对大数据速度较慢的 addRowData 方法

http://www.trirand.com/jqgridwiki/doku.php?id=wiki:options

于 2011-08-31T14:36:39.490 回答