如何通过ajax在jqgrid中加载数据（json）？

Question

我需要在 ajax 调用后填充 jqgrid。

我有一个返回这种 json 格式的函数（在 java serverlet 中）：

[{"citta":"XXXX","via":"XXX","telefono":"1111-11111","provincia":"XX","clienteDesc":"Prova","clienteCode":"XXXXX"}]

我将这段代码用于 jqgrid：

                $("#clienti-navgrid").jqGrid( { 
                            //data: c
                            //datatype: "local"
                            datatype: "json",
                url: '/project/loadnotespese.do',
                colNames:['Codice Cliente','Descrizone Cliente','Via','Città','Provincia','Telefono'],                
                colModel:[
                        {name:'clienteCode', index:'clienteCode', width:'10', sortable:false},  
                        {name:'clienteDesc', index:'clienteDesc', width:'20', sortable:false}, 
                        {name:'via', index:'via', width:'30', sortable:false},  
                        {name:'citta', index:'citta', width:'20', sortable:false},
                        {name:'provincia', index:'provincia', width:'10', sortable:false}, 
                        {name:'telefono', index:'telefono', width:'10', sortable:false} 
                ],
                rowNum:500,
                autowidth:true,
                height:'auto',
                recordtext:"Ordini trovati {2}",
                emptyrecords:"Nessun risultato",
                viewrecords: true,
                caption: 'Tabella Clienti',         
                localReader : {
                                    //
                    repeatitems: false,
                }
            });//jqGrid

如果我放了

var c = [{"citta":"XXXX","via":"XXX","telefono":"1111-11111","provincia":"XX","clienteDesc":"Prova","clienteCode":"XXXXX"}]

和

data: c, datatype: "local",

有效，但如果我从 url: '/project/loadnotespese.do' 获取，它不会工作。 有什么帮助吗？

Answer 1

如果您使用datatype: "local"，则将使用选项localReader。顺便说一下，repeatitems: false 的值是localReader 的默认 值（参见the documentation）。因此，如果使用 datatype: "local"，您可以从选项列表中删除当前选项 localReader: { repeatitems: false }。

另一方面，如果您使用datatype: "json" 另一个选项将使用jsonReader。 jsonReader 的repeatitems 属性的默认值为repeatitems: false（请参阅the documentation）。所以你必须添加

jsonReader: { repeatitems: false }

如果是 jqGrid 选项列表。之后，网格应该会被成功填充。

另一个需要了解的重要思想是在数据行的每个项目中指定id 属性的附加。 id 值在整个页面中必须是唯一的，它将用作网格体的行 (<tr>) 元素的 id 属性的值。如果行项目的某些其他属性可以用作唯一 id，您可以在jsonReader 中包含其他设置，或者在colModel 中列的相应定义中添加key: true 属性。例如，如果 clienteCode 可以解释为您可以使用的 rowid

jsonReader: { repeatitems: false, id: "clienteCode" }

已更新：您应该额外使用

root: function (obj) { return obj; }

在jsonReader 内部（参见here）。所以最后的jsonReader应该是

jsonReader: {
    repeatitems: false,
    id: "clienteCode",
    root: function (obj) {
        return obj;
    }
}