jqueryjqgrid使用手册

jqueryjqgrid使用手册内容摘要：

，则列宽度使用 colModel 指定的宽度 sortable boolean 是否可排序 false 否 sortname string 排序列的名称，此参数会被传到后台 空字符串 是 sortorder string 排序顺序，升序或者降序（ asc or desc） asc 是 subGrid boolean 是否使用 suggrid false 否 subGridModel array[] subgrid 模型 empty array 否 subGridType mixed 如果为空则使用表格的 dataType null 是 subGridUrl string 加载 subgrid 数据的 url， jqGrid 会把每行的 id值加到 url 中 空值 是 subGridWidth integer subgrid 列的宽度 20 否 toolbar array 表格的工具栏。 数组中有两个值，第一个为是否启用，第二个指定工具栏位置（相对于 body layer），如： [true,”both”]。 工具栏位置可选值： “top”,”bottom”, “both”. 如果工具栏在上面，则工具栏 id 为 “t_”+ 表格 id；如果在下面则为 “tb_”+ 表格 id；如果只有一个工具栏则为 “t_”+ 表格 id [false,39。 39。 ] 否 totaltime integer 只读属性，计算加载数据的时间。 目前支持 xml跟 json 数据 0 否 treedatatype mixed 数据类型，通常情况下与 datatype 相同，不会变 null 否 treeGrid boolean 启用或者禁用 treegrid 模式 false 否 treeGridModel string treeGrid 所使用的方法 nested 否 treeIcons array 树的图标，默认值：{plus:39。 uiicontriangle1e39。 ,minus:39。 uiicontriangle1s39。 ,leaf:39。 uiiconradiooff39。 } 否 treeReader array 扩展表格的 colModel且加在 colModel定义的后面 否 tree_root_level numeric root元素的级别， 0 否 url stri url null 是 ng userData array 从 request 中取得的一些用户信息 empty array 否 userDataOnFooter boolean 当为 true 时把 userData 放到底部，用法：如果userData 的值与 colModel 的值相同，那么此列就显示正确的值，如果不等那么此列就为空 false 是 viewrecords boolean 是否要显示总记录数 false 否 viewsortcols array 定义排序 列的外观跟行为。 数据格式：[false,39。 vertical39。 ,true].第一个参数是说，是否都要显示排序列的图标， false 就是只显示当前排序列的图标；第二个参数是指图标如何显示， vertical：排序图标垂直放置， horizontal：排序图标水平放置；第三个参数指单击功能，true：单击列可排序， false：单击图标排序。 说明：如果第三个参数为 false 则第一个参数必须为 ture 否则不能排序 否 width number 如果设置则按此设置为主，如果没有设置则按colModel 中定义的宽度计算 none 否 xmlReader array 对 xml 数据结构的描述 否 四、 jqGrid 学习 ColModel API ColModel 是 jqGrid 里最重要的一个属性，设置表格列的属性。 用法： Java 代码 1. jQuery(gridid).jqGrid({ 2. ... 3. colModel: [ {name:39。 name139。 , index:39。 index139。 ...}, {...}, ... ], 4. ... 5. })。 属性 数据类型 备注 默认值 align string 定义单元格对齐方式；可选值： left, center, right. left classes string 设置列的 css。 多个 class 之间用空格分隔，如： 39。 class1 class239。 表格默认的 css 属 empty string 性是 uiellipsis datefmt string 对日期列进行格式化。 ”/”, ” ”, and ”.” 都是有效的日期分隔符。 y,Y,yyyy 年 YY, yy 月 m,mm for monthsd,dd 日 . ISO Date (Ymd) defval string 查询字段的默认值 空 editable boolean 单元格是否可编辑 false editoptions array 对列进行编辑时设置的一些属性 empty array editrules array 对于可编辑单元格的一些额外属性设置 empty array edittype string 可以编辑的类型。 可选值： text, textarea, select, checkbox, password, button, image and file. text fixed boolean 列宽度是否要固定不可变 false formoptions array 对于 form 进行编辑时的属性设置 empty formatoptions array 对某些列进行格式化的设置 none formatter mixed 对列进行格式化时设置的函数名或者类型 none hidedlg boolean 是否显示或者隐藏此列 false hidden boolean 在初始化表格时是否要隐藏此列 false index string 当排序时定义排序字段名称的索引，参数名为 sidx empty string jsonmap string 定义了返回的 json 数据映射 none key boolean 当从服务器端返回的数据中没有 id 时，将此作为唯一 rowid 使用，默认只能有一个 id属性 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 string width number 默认列的宽度，只能是象素值，不能是百分比 150 xmlmap string 定义当前列跟返回的 xml数据之间的映射关系 none unformat function ‘unformat’ 单元格值 null 有一些参数当表格初始化完成后是不能被修改的： * name * width * resizable * label (method avail.) 五、 jqGrid 学习 数据 jqGrid 可支持的数据类型： xml、 json、 jsonp、 local or clientSide、 xmlstring、jsonstring 、 script、 function („)。 Json 数据 需要定义 jsonReader 来跟服务器端返回的数据做对应，其默认值： Java 代码 1. jQuery(gridid).jqGrid({ 2. ... 3. jsonReader : { 4. root: rows, 5. page: page, 6. total: total, 7. records: records, 8. repeatitems: true, 9. cell: cell, 10. id: id, 11. userdata: userdata, 12. subgrid: {root:rows, 13. repeatitems: true, 14. cell:cell 15. } 16. }, 17.... 18.})。 这样服务器端返回的数据格式： Java 代码 1. { 2. total: xxx, 3. page: yyy, 4. records: zzz, 5. rows : [ 6. {id:1, cell:[cell11, cell12, cell13]}, 7. {id:2, cell:[cell21, cell22, cell23]}, 8. ... 9. ] 10.} jsonReader 的属性 total 总页数 page 当前页 records 查询出的记录数 rows 包含实际数据的数组 id 行 id cell 当前行的所有单元格 * root 这个元素指明表格所需要的数据从哪里开始。 Java 代码 1. jQuery(gridid).jqGrid({ 2. ... 3. jsonReader : {root:invdata}, 4. ... 5. })。 从服务器端返回数据格式为： Java 代码 1. { 2. total: xxx, 3. page: yyy, 4. records: zzz, 5. invdata : [ 6. {id:1, cell:[cell11, cell12, cell13]}, 7. {id:2, cell:[cell21, cell22, cell23]}, 8. ... 9. ] 10.} * page * total * records 定义翻页所需要的信息 Java 代码 1. jQuery(gridid).jqGrid({ 2. ... 3. jsonReader : { 4. root:invdata, 5. page: currpage, 6. total: totalpages, 7. records: totalrecords 8. }, 9. ... 10.})。 服务器端返回数据： Java 代码 1. { 2. totalpages: xxx, 3. currpage: yyy, 4. totalrecords: zzz, 5. invdata : [ 6. {id:1, cell:[cell11, cell12, cell13]}, 7. {id:2, cell:[cell21, cell22, cell23]}, 8. .。