将jqGrid绑定到JSON对象

Question

如何将简单的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>

这会产生错误：

语法错误，未识别表达式：#在jQuery 1.6.2中

我还尝试使用json代替jsonstring，用数据替换datastr。这消除了错误，但网格仍然是空的。在这两种情况下，都会出现未定义的情况，或者在网格体中闪烁。

编辑

我也尝试过数据类型:以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" />

Answer 1

要使您的代码正常工作，需要进行三次更改(请参阅固定演示这里 )：

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

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

Answer 2

我想你是在找datatype: 'local'和data: tableSrc。

datatype：定义希望在网格中表示数据的信息类型。有效的选项是xml -我们期望xml数据；xmlstring -我们期望xml数据为string；JSON -我们期望JSON数据；jsonstring -我们期望json数据作为字符串；jsonstring-我们期望在客户端定义数据(数组数据)；javascript -我们期望javascript作为数据；函数-自定义函数用于检索数据。 data：存储传递给网格的本地数据的数组。如果要加载数组数据，可以直接指向该变量。它可以代替addRowData方法，因为它在相对大的数据上速度慢。

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