在 JQGrid 中映射 JSON 数据
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2690657/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Mapping JSON data in JQGrid
提问by hunt
I am using jqGrid 3.6.4 and a jquery 1.4.2 . in my sample i am getting following json data format & i want to map these json data into rows of a jqgrid
我正在使用 jqGrid 3.6.4 和 jquery 1.4.2 。在我的示例中，我遵循 json 数据格式 & 我想将这些 json 数据映射到 jqgrid 的行中
{
"page": "1",
"total": 1,
"records": "6",
"rows": [
{
"head": {
"student_name": "Mr S. Hyman ",
"year": 2007
},
"sub": [
{
"course_description": "Math ",
"date": "22-04-2010",
"number": 1,
"time_of_add": "2:00",
"day": "today"
}
]
}
]
}
my jqgrid code is as follows
我的jqgrid代码如下
jQuery("#"+subgrid_table_id).jqGrid({
url:"http://localhost/stud/beta/web/GetStud.php?sid="+sid,
dtatype: "json",
colNames: ['Stud Name','Year','Date'.'Number'],
colModel: [ {name:'Stud Name',index:'student_name', width:100, jsonmap:"student_name"},
{name:'Year',index:'year', width:100, jsonmap:"year"},
{name:'Date',index:'date', width:100, jsonmap:"date"},
{name:'Number',index:'number', width:100, jsonmap:"number"}
],
height:'100%',
jsonReader: { repeatitems : false, root:"head" },
});
So now the problem is as my data i.e. student_name and year is under "head" , the jqgrid is enable to locate these two fields. at the same time other two column values i.e. Date and Number lies under "sub" and even those columns i am not be able to map it with jqgrid
所以现在的问题是我的数据，即 student_name 和 year 在 "head" 下，jqgrid 能够定位这两个字段。同时其他两列值，即日期和数字位于“子”下，即使是那些列我也无法用 jqgrid 映射它
so kindly help me how to located these attributes in JQGrid.
所以请帮助我如何在 JQGrid 中定位这些属性。
Thanks
谢谢
回答by Oleg
First of all the code posted has some errors like dtatype: "json"instead of datatype: "json". "},});" instead of "}});" at the end of code and colNames: ['Stud Name','Year','Date'.'Number']instead of colNames: ['Stud Name','Year','Date','Number']. After fixing this clear bugs you need change jsonmapvalues. This was your main question. The fixed code will be look like following:
首先，发布的代码有一些错误，例如dtatype: "json"而不是datatype: "json". 在代码末尾用“ },});”代替“ }});”，而colNames: ['Stud Name','Year','Date'.'Number']不是colNames: ['Stud Name','Year','Date','Number']. 修复此清除错误后，您需要更改jsonmap值。这是你的主要问题。固定代码如下所示：
jQuery("#"+subgrid_table_id).jqGrid({
...
datatype: 'json',
colNames: ['Stud Name','Year','Date'.'Number'],
colModel: [
{name:'student_name', width:100, jsonmap:"head.student_name"},
{name:'year', width:100, jsonmap:"head.year"},
{name:'date', width:100, jsonmap:"sub.0.date"},
{name:'number', width:100, jsonmap:"sub.0.number"}
],
jsonReader: { repeatitems:false, root:"rows" }
});
You have to fix rootto "rows" and use jsonmapin JSON dot notation(see http://www.trirand.com/jqgridwiki/doku.php?id=wiki:retrieving_data#json_dot_notation). I use a little strange notation like "sub.0.number" because sub.0.numberin JavaScript is the same as sub[0].number. It works now.
您必须修复root为“ rows”并jsonmap在JSON 点符号中使用（请参阅http://www.trirand.com/jqgridwiki/doku.php?id=wiki:retrieving_data#json_dot_notation）。我使用了一个有点奇怪的符号，比如“ sub.0.number”，因为sub.0.number在 JavaScript 中与sub[0].number. 它现在有效。
I recommend you think one more about the structure of JSON data which you receive. (see my previous comments to you question): Is "sub" element is really an array with always one element or you want to use subgrids? Probably the data should be changed from sub:[{"":"", ...}]to sub:{"":"", ...}? What do you want to use as a rowid? student_name? Then add id: "head.student_name"to the jsonReaderdefinition or add key: trueproperty to the definition of the column student_name. Or you forget to include it in the JSON data?
我建议您再考虑一下您收到的 JSON 数据的结构。（请参阅我之前对您的问题的评论）：“子”元素是否真的是一个始终包含一个元素的数组，或者您想使用子网格？可能数据应该从 更改sub:[{"":"", ...}]为sub:{"":"", ...}？你想用什么作为rowid？student_name? 然后添加id: "head.student_name"到jsonReader定义或添加key: true属性到列的定义student_name。或者您忘记将其包含在 JSON 数据中？
And the last suggestion. If you open http://trirand.com/blog/jqgrid/jqgrid.htmland opens on the left side of tree the branch "Data Mapping" \ "Data optimization" you will see an example where on use only array instead of named elements in JSON. Such data will be have minimum size and can be transferred more quickly from server to client. You data instead have some fields (like "course_description") which you don't use at all. So if you can make any changes in the servercode try to optimize the data transfer rate.
还有最后一个建议。如果您打开http://trirand.com/blog/jqgrid/jqgrid.html并在树的左侧打开分支“数据映射”\“数据优化”，您将看到一个仅使用数组而不是命名的示例JSON 中的元素。此类数据将具有最小大小，并且可以更快地从服务器传输到客户端。您的数据有一些您根本不使用的字段（例如“ course_description”）。因此，如果您可以对服务器代码进行任何更改，请尝试优化数据传输速率。
