grid

描述

根据返回的 JSON 数据，创建通用表格，详见 http://www.trirand.com/jqgridwiki/doku.php?id=wiki:options，http://www.trirand.com/jqgridwiki/doku.php?id=wiki:events

参数

允许动态属性：

false
名称 必需 默认值 类型 描述
accesskey     String Set the html accesskey attribute on rendered html element
altClass   ui-priority-secondary String 用来指定斑马线行显示的 css 样式类，可以编辑自己的css文件，只有当 altRows 设为 ture时起作用
altRows   true Boolean 是否显示为斑马条纹
autoencode   true Boolean 是否对 url 进行编码，值为 true 时，会将 url 中的特殊字符符进行编码处理，如：小于号将被转义为 <
autowidth   true Boolean 如果为ture时，则当表格在首次被创建时会根据父元素比例重新调整表格宽度。
caption     String 表格名称
cellEdit   false Boolean 是否启用单元格编辑功能
cellurl     String 保存单元格数据时，提交的 ajax 请求的 url
cellsubmit     String 编辑单元格后，数据提交的目标位置，可选值：remote - 单元格内容改变后将启动ajax请求cellurl配置的地址保存到服务器上； clientArray - 不会发送ajax请求，修改后内容可以条用getChangedCells方法或者通过事件获取到
connectWith   empty string String Determines the target grid(s) to which the row should be dropped. The option is a string. In case of more than one grid the ids should be delemited with comma - i.e #grid1, #grid2
cssClass     String The css class to use for element
cssErrorClass     String The css error class to use for element
cssErrorStyle     String The css error style definitions for element to use
cssStyle     String The css style definitions for element to use
direction   ltr String 设置文字显示方向，可先值： ltr - 从左到右；rtl - 从右到左
disabled     String Set the html disabled attribute on rendered html element
editinline   false Boolean 是否允许在行内编辑
editurl     String 编辑完某条数据后，点击“保存”时提交 Ajax 请求的 URL
errorPosition     String Define error position of form element (top|bottom)
filter   false Boolean 是否在表头的下方显示过滤行（在各列头文字正文显示一个文本框）
filterOptions     String 表头下方过滤行的过滤选项，只有 fileter = true 时才生效，如：{ autosearch : false, formtype : vertical }
footerrow   false Boolean 当为true时，会在翻页栏之上增加一行
gridModel   data String 后台返回的 JSON 数据中指向真正的数据模型集合的 key，对应 jqGrid 组件 options 参数的 jsonReader.root 属性
gridview   false Boolean 是否在构造一行数据后立即添加到grid中，如果设为true则是将整个表格的数据都构造完成后再添加到grid中，但treeGrid, subGrid, or afterInsertRow 不能用
groupCollapse   false Boolean Defines if the initially the grid should show or hide the detailed rows of the group.
groupColumnShow     String Show/Hide the column on which we group. The value here should be a boolean true/false for the group level. If the grouping is enabled we set this value to true. e.g. [true]
groupDataSorted   false Boolean 如果此参数设置为true，我们才能告诉他对数据进行排序发送一个额外的参数给服务器。这样，所有的排序是工作在服务器留下网格只显示分组的数据。如果该参数为false另外之前显示的数据，我们做我们自己的排序，以支持分组。这当然减缓相对大数据的速度。当 datatype is local此参数是无效的数据类型是本地的。
groupField     String Defines the name from colModel on which we group. The first value is the first lavel, the second values is the second level and etc. Currently only one level is supported. e.g. ['name']
groupMinusIcon   ui-icon-circlesmall-minus String 收起树节点的图标样式类
groupOrder     String Defines the initial sort order of the group level. Can be asc for ascending or desc for descending order. If the grouping is enabled the default value is asc. e.g. ['asc']
groupPlusIcon   ui-icon-circlesmall-plus String 展开树节点的图标样式类
groupShowSummaryOnHide   false Boolean 收起树节点后，是否显示摘要
groupSummary     String Enable or disable the summary (footer) row of the current group level. If grouping is set the default value for the group is false. e.g. [true]
groupText     String Defines the grouping header text for the group level that will be displayed in the grid. By default if defined the value if {0} which means that the group value name will be displayed. It is possible to specify another value {1} which meant the the total cont of this group will be displayed too. It is possible to set here any valid html content. e.g. ['{0} - {1} Item(s)']
height   150 String 表格高度，单位为像素
hiddengrid   false Boolean 当为ture时，表格不会被显示，只显示表格的标题。只有当点击显示表格的那个按钮时才会去初始化表格数据。
hidegrid   false Boolean 是否显示控制表格显示、隐藏的按钮，只有当caption 属性不为空时起效。
hoverrows   false Boolean 当值为 false 时 mouse hovering 会被禁用。
id     String HTML id attribute
javascriptTooltip   false Boolean Use JavaScript to generate tooltips
key     String Set the key (name, value, label) for this particular component
label     String Label expression used for rendering an element specific label
labelSeparator   : String String that will be appended to the label
labelposition     String Define label position of form element (top/left)
loadonce   false Boolean 如果为 ture，则数据只从服务器端获取一次，之后所有操作都是在客户端执行，翻页功能会被禁用
multiboxonly   false Boolean 设为 ture 时只有选择 checkbox 才会选择多行。只有当 multiselect=true 时才生效
multiselect   false Boolean 是否可以多选
multiselectWidth   20 Integer 当multiselect为true时设置multiselect列宽度
name     String The name to set for element
navigator   false Boolean 是否显示表格左下角的“新增”、删除等按钮的导航条，true|false.
navigatorAdd   true Boolean 是否在导航按钮条中显示“新增”按钮
navigatorAddOptions     String “新增”按钮操作的选项。如：{height:280,reloadAfterSubmit:false},
navigatorCloneToTop   false Boolean 是否将表格底部分页栏中的“新增”、删除等按钮的导航条复制到表格顶部的分布栏中（只有 toppager=true 时才生效）
navigatorDelete   true Boolean 是否在导航按钮条中显示“删除”按钮
navigatorDeleteOptions     String “删除”按钮操作的选项。如：{height:280,reloadAfterSubmit:false},
navigatorEdit   true Boolean 是否在导航按钮条中显示“编辑”按钮
navigatorEditOptions     String “编辑”按钮操作的选项。如： {height:280,reloadAfterSubmit:false},
navigatorExtraButtons     String 新增到导航按钮条中的按钮定义，如： { seperator: { title : 'seperator' }, hidebutton : { title : 'Show Hide', icon: 'ui-icon-gear', topic: showHideGrid} }
navigatorInlineEditButtons   true Boolean 点击导航按钮条中的“新增”和“编辑”按钮时，是否在表格行内编辑，值为 true 时，直接在表格中编辑， 值为 false 时在弹出的 form 中编辑
navigatorRefresh   true Boolean 是否在导航按钮条中显示“刷新”按钮
navigatorSearch   true Boolean 是否在导航按钮条中显示“查找”按钮
navigatorSearchOptions     String “查找”按钮操作的选项。如：{height:280,reloadAfterSubmit:false},
navigatorView   false Boolean 是否在导航按钮条中显示“查看”按钮
navigatorViewOptions     String “查看”按钮操作的选项。如：{sopt:['cn','bw','eq','ne','lt','gt','ew']},
onCellEditErrorTopics     String 单元格编辑出错时（触发 onCellEditError 事件时）发布的主题，多值之间使用逗号分隔
onCellEditSuccessTopics     String 单元格编辑成功时（触发 onCellEditSuccess 事件时）发布的主题，多值之间使用逗号分隔
onCellSelectTopics     String 在选中表格中的行时（触发 onCellSelect 事件时）发布的主题，多值之间使用逗号分隔。参数: rowid - 选中单元格所在行的索引, iCol is the index of the cell, cellcontent is the content of the cell, e is the event object element where we click.
onClickGroupTopics     String A comma delimited list of topics that published when a group is clicked.
onDblClickRowTopics     String 双击表格中的行时（触发 onDblClickRow 事件时）发布的主题，多值之间使用逗号分隔
onEditInlineAfterSaveTopics     String 行内编辑将数据保存到后台后（触发 onEditInlineAfterSave 事件时）发布的主题，多值之间使用逗号分隔
onEditInlineBeforeTopics     String 开始进行行内编辑时（触发 onEditInlineBefore 事件时）发布的主题，多值之间使用逗号分隔
onEditInlineErrorTopics     String 行内编辑出错时（触发 onEditInlineError 事件时）发布的主题，多值之间使用逗号分隔
onEditInlineSuccessTopics     String 行内编辑成功时（触发 onEditInlineSuccess 事件时）发布的主题，多值之间使用逗号分隔
onGridCompleteTopics     String 表格初始化完成后（触发 onGridComplete 事件时）发布的主题，多值之间使用逗号分隔
onRightClickRowTopics     String 右击表格中的行时（触发 onDblClickRow 事件时）发布的主题，多值之间使用逗号分隔。注意 - 此事件不支持 Opera 浏览器，因为 Opera 浏览器不支持 oncontextmenu 事件
onSelectAllTopics     String 将表格中的行全部选中时（触发 onSelectAll 事件时）发布的主题，多值之间使用逗号分隔
onSelectRowTopics     String 在选中表格中的行时（触发 onSelect 事件时）发布的主题，多值之间使用逗号分隔
onSortColTopics     String 对表格中的数据进行排序时（触发 onSortCol 事件时）发布的主题，多值之间使用逗号分隔。 参数: index - 排序列在 colModel 中的位置, iCol - 排序列的 name, sortorder - 排序方向，可能值有 'asc' 或 'desc'
onSubGridRowExpanded     String A comma delimited list of topics that published when subgrid row is expanded. Set event.originalEvent.orginal.proceed = false in your topic to prevent default action.
onblur     String Set the html onblur attribute on rendered html element
onchange     String Set the html onchange attribute on rendered html element
onclick     String Set the html onclick attribute on rendered html element
ondblclick     String Set the html ondblclick attribute on rendered html element
onfocus     String Set the html onfocus attribute on rendered html element
onkeydown     String Set the html onkeydown attribute on rendered html element
onkeypress     String Set the html onkeypress attribute on rendered html element
onkeyup     String Set the html onkeyup attribute on rendered html element
onmousedown     String Set the html onmousedown attribute on rendered html element
onmousemove     String Set the html onmousemove attribute on rendered html element
onmouseout     String Set the html onmouseout attribute on rendered html element
onmouseover     String Set the html onmouseover attribute on rendered html element
onmouseup     String Set the html onmouseup attribute on rendered html element
onselect     String Set the html onselect attribute on rendered html element
openTemplate     String Set template to use for opening the rendered html.
page   1 Integer 设置初始的页码
prmNames   {page:"page",rows:"rows", sort: "sidx",order: "sord", search:"_search", nd:"nd", id:"id",oper:"oper",editoper:"edit",addoper:"add",deloper:"del", subgridid:"id", npage: null, totalrows:"totalrows"} String 定义向服务器发送请求时的参数名称，是一个 JSON 对象。
reloadTopics     String 重新装载数据时（触发 onReload 事件时）发布的主题，多值之间使用逗号分隔
requiredLabel   false Boolean If set to true, the rendered element will indicate that input is required
requiredPosition     String Define required position of required form element (left|right)
rowTotal   null Integer When set this parameter can instruct the server to load the total number of rows needed to work on. Note that rowNum determines the total records displayed in the grid, while rowTotal the total rows on which we operate. When this parameter is set we send a additional parameter to server named totalrows. You can check for this parameter and if it is available you can replace the rows parameter with this one. Mostly this parameter can be combined wit loadonce parameter set to true.
rownumbers   true Boolean 如果为 ture 则会在表格左边新增一列，显示行顺序号，从 1 开始递增，此列名为 'rn'
scroll   false Boolean 创建一个动态滚动的表格，当为true时，翻页栏被禁用，使用垂直滚动条加载数据，且在首次访问服务器端时将加载所有数据到客户端。当此参数为数字时，表格只控制可见的几行，所有数据都在这几行中加载
scrollrows   false Boolean 当值为 true 时，让所选择的行可见
searchForm     String 表格对应的查询表单（form） 的 ID
shrinkToFit   true Boolean 用来说明当初始化列宽度时候的计算类型，如果为ture，则按比例初始化列宽度。如果为false，则列宽度使用 colModel 指定的宽度
sortableRows   false Boolean 行是否可以进行排序，true|false
sortname     String 默认的排序列。可以是 colModel 的列名称或者是一个数字，这个参数会被提交到后台
sortorder   asc String 排序顺序，可选值：asc - 升序 ，desc - 降序
subGridUrl     String 加载 subgrid 数据的 url，jqGrid 会把每行的 id 值加到 url 的参数中
subGridWidth   20 Integer 定义子表中列的宽度
tabindex     String Set the html tabindex attribute on rendered html element
template     String The template (other than default) to use for rendering the element
templateDir     String The template directory.
theme     String The theme (other than default) to use for rendering the element
title     String Set the html title attribute on rendered html element
tooltip     String Set the tooltip of this particular component
tooltipCssClass   StrutsTTClassic String CSS class applied to JavaScrip tooltips
tooltipDelay   Classic String Delay in milliseconds, before showing JavaScript tooltips
tooltipIconPath     String Icon path used for image that will have the tooltip
toppager   false Boolean 是否在表格顶部显示分页栏，true|false
userDataOnFooter   false Boolean 当为 true 时把 userData 放到底部。用法：如果 userData 的值与 colModel 的值相同，那么此列就显示正确的值，如果不等那么此列就为空
value     String Preset the value of input element.
viewsortcols     Array 定义排序列的外观跟行为。数据格式：[false,'vertical',true]，第一个参数是说，是否都要显示排序列的图标，false 表示只显示 当前排序列的图标；第二个参数是指图标如何显示，可先值：vertical - 排序图标垂直放置，horizontal - 排序图标水平放置；第三个参数指单击功能：true - 单击列可排序，false - 单击图标排序。说明：如果第三个参数为false则第一个参数必须为ture否则不能排序
width     Integer 如果设置则按此设置为主，如果没有设置则按colModel中定义的宽度计算

示例代码

example descript...

这里是示例代码块