1，一个jqGrid的例子,方便看参数的意思
jQuery(function($) { var grid_selector = "#grid-table"; var pager_selector = "#grid-pager"; jQuery(grid_selector).jqGrid({ url:"/jqGrid/select.html", mtype:"get", datatype: "json", height: 250, colNames:[' ', 'ID','Last Sales','Name', 'Stock', 'Ship via','Notes'], colModel:[ {name:'myac',index:'', width:80, fixed:true, sortable:false, resize:false}, {name:'id',index:'id', width:60, sorttype:"int", editable: true}, {name:'sdate',index:'sdate',width:90, editable:true, sorttype:"date",unformat: pickDate}, {name:'name',index:'name', width:150,editable: true,editoptions:{size:"20",maxlength:"30"}}, {name:'stock',index:'stock', width:70, editable: true,edittype:"checkbox",editoptions: {value:"Yes:No"},unformat: aceSwitch}, {name:'ship',index:'ship', width:90, editable: true,edittype:"select",editoptions:{value:"FE:FedEx;IN:InTime;TN:TNT;AR:ARAMEX"}}, {name:'note',index:'note', width:150, sortable:false,editable: true,edittype:"textarea", editoptions:{rows:"2",cols:"10"}} ], rowNum:10, rowList:[10,20,30], pager : pager_selector, altRows: true, multiselect: true, //multikey: "ctrlKey", multiboxonly: true, loadComplete : function() { var table = this; setTimeout(function(){ enableTooltips(table); }, 0); }, editurl: $path_base+"/jqGrid/update.html",//nothing is saved caption: "jqGrid with inline editing", autowidth: true }); 2，ColModel，展示数据的字段名称以及一些属性设置
属性 | 数据类型 | 备注 | 默认值 |
align | string | left, center, right. | left |
classes | string | 设置列的css。多个class之间用空格分隔，如：'class1 class2' 。表格默认的css属性是ui-ellipsis | empty string |
datefmt | string | ”/”, ”-”, and ”.”都是有效的日期分隔符。y,Y,yyyy 年YY, yy 月m,mm for monthsd,dd 日. | ISO Date (Y-m-d) |
defval | string | 查询字段的默认值 | 空 |
editable | boolean | 单元格是否可编辑 | false |
editoptions | array | 编辑的一系列选项。{name:’__department_id’,index:’__department_id’,width:200,editable:true,edittype:’select’,editoptions: {dataUrl:”${ctx}/admin/deplistforstu.action”}},这个是演示动态从服务器端获取数据。 | empty |
editrules | array | 编辑的规则{name:’age’,index:’age’, width:90,editable:true,editrules: {edithidden:true,required:true,number:true,minValue:10,maxValue:100}},设定 年龄的最大值为100，最小值为10，而且为数字类型，并且为必输字段。 | empty |
edittype | string | 可以编辑的类型。可选值：text, textarea, select, checkbox, password, button, image and file. | text |
fixed | boolean | 列宽度是否要固定不可变 | false |
formoptions | array | 对于form进行编辑时的属性设置 | empty |
formatoptions | array | 对某些列进行格式化的设置 | none |
formatter | mixed | 对列进行格式化时设置的函数名或者类型 {name:’sex’,index:’sex’, align:’center’,width:60,editable:true,edittype:’select’,editoptions: {value:’0:待定;1:男;2:女’},formatter:function(cellvalue, options, rowObject){ var temp = “<img src=’${ctx}/jquery-ui-1.7.2.custom/css/img/”if(cellvalue==1){ temp = temp +”user-white.png”;} else if(cellvalue==2){ temp = temp +”user-white-female.png”;} else { temp = temp + “user-silhouette.png”;}temp = temp + “‘ border=’0′ />”return temp;}},//返回性别的图标。 | none |
hidedlg | boolean | 是否显示或者隐藏此列 | false |
hidden | boolean | 在初始化表格时是否要隐藏此列 | false |
index | string | 索引。其和后台交互的参数为sidx | empty |
jsonmap | string | 定义了返回的json数据映射 | none |
key | boolean | 当从服务器端返回的数据中没有id时，将此作为唯一rowid使用只有一个列可以做这项设置。如果设置多于一个，那么只选取第一个，其他被忽略 | false |
label | string | 如果colNames为空则用此值来作为列的显示名称，如果都没有设置则使用name 值 | none |
name | string | 表格列的名称，所有关键字，保留字都不能作为名称使用包括subgrid, cb and rn. | Required |
resizable | boolean | 是否可以被resizable | true |
search | boolean | 在搜索模式下，定义此列是否可以作为搜索列 | true |
searchoptions | array | 设置搜索参数 | empty |
sortable | boolean | 是否可排序 | true |
sorttype | string | 用在当datatype为local时，定义搜索列的类型，可选值：int/integer - 对integer排序float/number/currency - 排序数字date - 排序日期text - 排序文本 | text |
stype | string | 定义搜索元素的类型 | text |
surl | string | 搜索数据时的url | empty |
width | number | 默认列的宽度，只能是象素值，不能是百分比 | 150 |
xmlmap | string | 定义当前列跟返回的xml数据之间的映射关系 | none |
unformat | function | ‘unformat’单元格值 | null |
3,JsonReader 读取服务器返回的json数据并解析
jqGrid为其设了默认值
jsonReader : { root: "rows",//返回的数组集合 page: "page",//当前页数 total: "total", //总页数 records: "records",//总行数 repeatitems: true,//指明每行的数据是可以重复的，如果设为false，则会从返回的数据中按名字来搜索元素 cell: "cell", id: "id", userdata: "userdata", //我们需要用的一些并不想显示到页面上的数据 //下面一般不用 subgrid: {root:"rows", //是否使用suggrid模型 repeatitems: true, cell:"cell" }
4，prmNames选项
，设置jqGrid将要向Server传递的参数名称。其默认值为：
prmNames : {
page:"page", // 表示请求页码的参数名称
rows:"rows", // 表示请求行数的参数名称
sort: "sidx", // 表示用于排序的列名的参数名称
order: "sord", // 表示采用的排序方式的参数名称
search:"_search", // 表示是否是搜索请求的参数名称
nd:"nd", // 表示已经发送请求的次数的参数名称
id:"id", // 表示当在编辑数据模块中发送数据时，使用的id的名称
oper:"oper", // operation参数名称
editoper:"edit", // 当在edit模式中提交数据时，操作的名称
addoper:"add", // 当在add模式中提交数据时，操作的名称
deloper:"del", // 当在delete模式中提交数据时，操作的名称
subgridid:"id", // 当点击以载入数据到子表时，传递的数据名称
npage: null,
totalrows:"totalrows" // 表示需从Server得到总共多少行数据的参数名称，参见jqGrid选项中的rowTotal
}