您的位置：首页 > 理论基础 > 计算机网络

5、jqGrid 3.6.2 中文文档——BasicGrid（3）http://blog.csdn.net/homez/archive/2010/07/29/5773675.aspx

2010-09-09 14:40 411 查看

Events

（事件）

事件响应动作被设置为表格的属性，以下定义了行被选中时的响应：

var lastSel;

jQuery("#gridid").jqGrid({

...

onSelectRow: function(id){

if(id && id!==lastSel){

jQuery('#gridid').restoreRow(lastSel);

lastSel=id;

}

jQuery('#gridid').editRow(id, true);

},

...

});

以下按字母顺序列出了可响应的时间：

事件	参数	描述
afterInsertRow	Rowed Rowdata Rowelem	此事件发生在每次插入行后 rowid 为插入的行 ID rowdata 是被插入行的数据数组。格式为 name:value 对， name 在 colModel 定义 rowelem 是应答元素。 xml 为 xml 行， json 为所有行数据。注意：若 gridview 为 true ，此事件不会发生
beforeRequest	none	此事件发生在任何数据请求前，但当 datatype 为 function 时不发生。
beforeSelectRow	rowid, e	此事件发生在用户点击行，选中该行前。 rowid 为行的 ID ， e 为事件对象该事件将返回布尔值 true （行被选中）或 false （行未被选中）。
gridComplete	none	此事件发生在表格所有数据装入和进程完成后。与 datatype 参数及排序分页等无关。
loadBeforeSend	xhr	此事件发生在 XMLHttpRequest 被发送前，用于修改对象属性（如 headers ）。 xhr 为 XMLHttpRequest 对象。
loadComplete	xhr	此事件发生在每个服务器请求后。 xhr 为 XMLHttpRequest 对象。
loadError	xhr, status, error	此事件在请求失败时发生。事件有 3 个参数： xhr 为 XMLHttpRequest 对象； Satus 为错误类型描述； error 为错误对象。
onCellSelect	rowid, iCol, cellcontent, e	此事件在点击表格特定单元格时发生。 rowid 为行 ID ； iCol 为列索引； cellcontent 为单元格中内容； e 点击事件对象。
ondblClickRow	rowid, iRow, iCol, e	此事件发生在行双击后发生。 rowid 为行 ID ； iRow 为行索引（勿与 rowid 混淆）； iCol 为列索引； e 为事件对象。
onHeaderClick	gridstate	此事件发生在点击显示或隐藏表格后发生（ hidegrid 为 true ） gridstate 为表格状态，有 visible 和 hidden 两个值
onPaging	pgButton	此事件发生在点击 page button 后，填充数据前，及用户输入一个与当前页页码不同的新页码并回车时。参见 pager
onRightClickRow	rowid, iRow, iCol, e	此事件发生在右击行后。（此事件在 Opera 浏览器中无效） rowid 为行 ID ； iRow 为行索引（勿与 rowid 混淆） iCol 为列索引； e 为事件对象。
onSelectAll	aRowids, status	此事件发生在点击标题的复选框时发生（ multiselect 为 true ） aRowids 选定行 ID 的数组（哪些行的复选框与头复选框相同） status 头复选框的选定的布尔值， true 为选中， false 为未选中
onSelectRow	rowid, status	此事件发生在行点击后 rowid 为行 ID ； status 为选择状态。当 multiselect 为 true 时使用，当行被选中时返回 true ；为选中时返回 false 。
onSortCol	index, iCol, sortorder	此事件发生在列排序被点击之后，数据排序前 index 为 colModel 中定义的索引名； iCol 为列的索引号 sortorder 为新的排序方式， asc 或 desc
resizeStart	event, index	此事件发生在列被重新定义宽度时。 event 为事件对象； index 为在 colModel 中定义的列索引。
resizeStop	newwidth, index	此事件发生在列被重新定义宽度后。 newwidth 为新的列宽度； index 为在 colModel 中定义的列索引。
serializeGridData	postData	通过此事件可以序列化传递给 ajax 请求的的数据。此事件将返回一个以序列化的数据。若有自定义的数据（如 JSON 字符串、 XML 字符串）要发给服务器时，可使用该事件。

关于单元格编辑、子表的事件情参阅
Additional Events

Methods

（方法）

此节描述
jqGrid

的基本方法。一些方法要求装入附加模块。

jqGrid 3.6

使用新的
jQuery UI

库接口，请参阅以下内容和
jqGrid

事件。

网格相关的方法

jqGrid

方法调用格式：

<script>

...

jQuery("#grid_id").jqGridMethod( parameter1,...parameterN );

...

</script>

这里：
grid_id

是表格的
id

；

jqGridMethod

为
jqGrid

方法；

parameter1,…parameterN

未参数列表

若方法未定义返回值，则返回到
jqGrid

对象，一组方法可以链接起来，例如

<script>

...

jQuery("#grid_id").setGridParam({...}).hideCol("somecol").trigger("reloadGrid");

...

</script>

或使用新的接口

<script>

...

jQuery("#grid_id").jqGrid('method', parameter1,...parameterN );

...

</script>

这里：

grid_id

是表格的
id

；

Method

是方法名；

parameter1,…parameterN

是参数列表。

下面是实例：

<script>

...

jQuery("#grid_id").jqGrid('setGridParam',{...}).jqGrid('hideCol',"somecol").trigger("reloadGrid");

...

</script>

为使用新的
API

配置
jqGrid

在安装过程中按此步骤做：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>My First Grid</title>

<link rel="stylesheet" type="text/css" media="screen"

href="css/ui-lightness/jquery-ui-1.7.1.custom.css" />

<link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />

<script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>

<script src="js/i18n/grid.locale-en.js" type="text/javascript"></script>

<script type="text/javascript">

jQuery.jgrid.no_legacy_api = true;

</script>

<script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>

</head>

<body>

...

</body>

</html>

请注意调用：

<script type="text/javascript">

jQuery.jgrid.no_legacy_api = true;

</script>

此行请在语言文件后，
jqGrid

的
JS

文件前

绿色的方法名要求特殊的程序。见方法的描述和例程

方法	参数	返回值	描述
addJSONData	data	none	用传递的 data （数组）填充网格。用法：假如我们从 web 服务器获得的数据（ jsonresponse ），则 var mygrid = jQuery(”#”+grid_id)[0]; var myjsongrid = eval(”(”+jsonresponse.responseText+”)”); mygrid.addJSONData(myjsongrid); myjsongrid = null; jsonresponse =null; 将填充网格。当然， myjsongrid 中的数据在传递到 addJSONData 之前可以被操作。
addRowData	rowid, data, position, srcrowid	成功返回 true ，否则返回 false 。	插入一新行， rowid 为新行的 ID ， data （数组）为新行数据， position 为新行插入的位置（ first 为表头， last 为表尾， srcrowid 指定偏移位置）。 Data 数组的格式为： : {name1:value1,name2: value2…} ， name 为 colModel 指定的名称。
addXMLData	data	none	用传入的 data 填充网格。用法：假如我们从 web 服务器获得数据 (xmlresponse) ，则 var mygrid = jQuery(”#”+grid_id)[0]; mygrid.addXmlData(xmlresponse.responseXML); 将填充网格。当然， xmlresponse 中的数据在传递到 addXmlData 之前可以被操作。
clearGridData	clearfooter	jqGrid object	清除网格中当前装入的数据，如果 clearfooter 参数为 true ，则清除网格最后一行数据。
delRowData	rowid	成功返回 true 否则返回 false	删除 id = rowid 的行。但不会删除服务器上的数据。
footerData	action, data, format	jqGrid 对象	此方法获得或设置网格底部数据。见 footerrow in options array 。 action – 可设置为 get （缺省）或 set 。 Get 从底部返回 name:value 对象（ name 为 colModel 中的名称）。此时其他两个参数无效。 Set 将 data 数组（对象）设置到底部。 Data 为 colName 中的名称和值对。 format – 缺省为 true ，表示设置时使用 formatter ( 如果 colModel 中已定义 ) 。 false 表示不使用 formatter 。
getCell	rowid, iCol	单元格内容	返回 id = rowid 行， column = iCol 列的内容。 iCol 可以是列的索引或 colName 中定义的名称。在编辑行或列时不能使用该方法，此时返回的不是当前值，而是原始值。
getCol	colname, returntype, mathoperation	数组或值	返回列值数组。 colname 可以是列的索引值或 colModel 中的名称。 returntype 确定返回数组的类型，为 false( 缺省 ) 时，数组只包含值。为 true 时为对象数组，格式为 {id:rowid, value:cellvalue} ， id 为行的 id ， cellvalue 为单元格的值。如 [{id:1,value:1},{id:2,value:2}…] mathoperation 为可选参数，可以是 sum 、 avg 和 count 。若此参数进行了有效设置，则返回计算后的值，若无效，则返回空数组。
getDataIDs	none	数组	返回当前网格显示数据的 ID 数组。无数据时返回空数组。
getGridParam	name	混合值	返回请求的参数的值。 name 是 options 数组中的名称，若为设置则 options 被返回。详见 options .
getInd	rowid, rowcontent	mixed	当 rowcontent 设置为 false （缺省）时，返回 id= rowid 行的索引值。若 rowcontent 设置为 true ，则返回整行。若为找到 rowid 则返回 false 。
getRowData	rowid or none	array{}	返回 id = rowid 行的数据数组。格式为 name:value 对， name 为 colModel 中的名称， value 为该行的值。未找到返回空数组。在行或列编辑时此方法不可用，此时返回的不是当前值，而是原始值。若 rowid 为设置，则返回网格中所有数据数组。
hideCol	Colname 或 [colnames]	jqGrid 对象	根据 colname 或 colnames 数组给定的列名隐藏相应的列，列名必须是 colModel 中定义的名称。表格的宽度不会改变。
remapColumns	permutation, updateCells, keepHeader	none	调整列的显示顺序。 permutation 指定调整后的顺序，如 [1,0,2] 表示第一列在第二位显示。若 updateCells 设置为 true ，列数据将重新排序。若 keepHeader 设置为 true ， header 单元格将重新排序。
resetSelection	none	jqGrid 对象	选择（反选）行。多选择模式下同样可用。
setCaption	caption	jqGrid 对象	设置新的表头文字。若表头为隐藏，将显示。
setCell	rowid, colname, data, class, properties	jqGrid 对象	修改单元格的值、类或样式。其中： Rowid 为行 ID ； Colname 为列名（可以是从 0 开始的列的索引值）； data 设置的内容，若为空，则不修改； class 若为字符串，将使用 addClass 为列加入一个类，若为数组，将直接加入 CSS 中； properties 设置单元格属性。
setGridParam	object	jqGrid 对象	设置一个特定的参数。有些参数需 trigger(“reloadGrid”) 才能生效。注意这个方法可以覆盖事件。名称（ name:value 对）为选项数组中的名称。选项信息参见 options .
setGridHeight	new_height	jqGrid 对象	动态设置网格高度。只能对单元格的高度进行设置而不是网格。 new_height 可以是像素、百分比或 auto 。
setGridWidth	new_width, shrink	jqGrid 对象	动态设置网格宽度。 new_width 为新宽度的像素值； shrink （ true 或 false ）作用同 shrinkToFit （见 options ）。若不设置，则使用 shrinkToFit 设置。
setLabel	colname, data, class, properties	jqGrid 对象	设置指定列标题文字、属性和类： colname 为列名，可以是从 0 开始的列索引； data 为标题文字，为空则不修改； class 若为字符串，则为类名，若为数组，则直接写入 CSS ； properties 为标题文字的属性。
setRowData	rowid, data, cssprop	成功返回 true ，否则返回 false	更新 rowid 指定行的数据（使用数组）。 Data 数组的格式为 : {name1:value1,name2: value2…} 。 name 为 colModel 中描述的名称， value 为新值。 cssprop 若为字符串，将使用 addClass 为行添加类；若为数组对象，则直接加入 CSS 中。将 data 设置为 false 的情况下，可设置属性和类名
setSelection	rowid, onselectrow	jqGrid 对象	选择或反选 id = rowid 指定的行。若 onselectrow 设置为 true ( 缺省 ) 则触发 onSelectRow 事件，否则不触发。
showCol	colname	jqGrid 对象	显示 colname 指定的列。若 colname 为字符串，只显示指定的列，若 colname 为数组 [“name1”,”name2”] 则显示 name1 和 name2 列， name 必须是 colModel 中的名称。宽度不变。
trigger(“reloadGrid”)	none	none	按当前设置重新加载网格。若 datatype 为 xml 或 json ，将从服务器重新请求数据。此方法适用于一个已建立的网格。注意不会改变表头，也就是说改变 colModel 将没有作用。你可用 gridUnload ，使用新 colModel 来重新加载。
updateColumns	none	none	在拖拽表格时，同步网格宽度。用法： var mygrid=jQuery(”#grid_id”)[0]; mygrid.updateColumns();

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航