首页 > 代码库 > 【转】Jqgrid学习之数据
【转】Jqgrid学习之数据
jqGrid可支持的数据类型:xml、json、jsonp、local or clientSide、xmlstring、jsonstring
、script、function (…)。
Json数据
需要定义jsonReader来跟服务器端返回的数据做对应,其默认值:
· jsonReader : {
· root: "rows",
· page: "page",
· total: "total",
· records: "records",
· repeatitems: true,
· cell: "cell",
· id: "id",
· userdata: "userdata",
· subgrid: {root:"rows",
· repeatitems: true,
· cell:"cell"
· }
这样服务器端返回的数据格式:
· {
· total: "xxx",
· page: "yyy",
· records: "zzz",
· rows : [
· {id:"1", cell:["cell11", "cell12", "cell13"]},
· {id:"2", cell:["cell21", "cell22", "cell23"]},
· ...
· ]
· }
jsonReader的属性
total | 总页数 |
page | 当前页 |
records | 查询出的记录数 |
rows | 包含实际数据的数组 |
id | 行id |
cell | 当前行的所有单元格 |
自定义:
· jQuery("#gridid").jqGrid({
· ...
· jsonReader : {
· root:"invdata",
· page: "currpage",
· total: "totalpages",
· records: "totalrecords",
· cell: "invrow"
· },
· ...
· });
· totalpages: "xxx",
· currpage: "yyy",
· totalrecords: "zzz",
· invdata : [
· {id:"1", invrow:["cell11", "cell12", "cell13"]},
· {id:"2", invrow:["cell21", "cell22", "cell23"]},
· ...
· ]
repeatitems
指明每行的数据是可以重复的,如果设为false,则会从返回的数据中按名字来搜索元素,这个名字就是colModel中的名字
· jsonReader : {
· root:"invdata",
· page: "currpage",
· total: "totalpages",
· records: "totalrecords",
· repeatitems: false,
· id: "0"
· }
· totalpages: "xxx",
· currpage: "yyy",
· totalrecords: "zzz",
· invdata : [
· {invid:"1",invdate:"cell11", amount:"cell12", tax:"cell13", total:"1234", note:"somenote"},
· {invid:"2",invdate:"cell21", amount:"cell22", tax:"cell23", total:"2345", note:"some note"},
· ...
· ]
此例中,id属性值为“invid”。
一旦当此属性设为false时,我们就不必把所有在colModel定义的name值都赋值。因为是按name来进行搜索元素的,所以他的排序也不是按colModel中指定的排序结果。
用户数据(user data)
在某些情况下,我们需要从服务器端返回一些参数但并不想直接把他们显示到表格中,而是想在别的地方显示,那么我们就需要用到userdata标签
· jsonReader: {
· ...
· userdata: "userdata",
· ...
· }
· {
· total: "xxx",
· page: "yyy",
· records: "zzz",
· userdata: {totalinvoice:240.00, tax:40.00},
· rows : [
· {id:"1", cell:["cell11", "cell12", "cell13"]},
· {id:"2", cell:["cell21", "cell22", "cell23"]},
· ...
· ]
· }
在客户端我们可以有下面两种方法得到这些额外信息:
1. jQuery("grid_id").getGridParam(‘userData‘)
2. jQuery("grid_id").getUserData()
3. jQuery("grid_id").getUserDataItem( key )
【转】Jqgrid学习之数据