jqGrid -- 方法

来源：互联网发布：淘宝优惠券qqfxb 编辑：程序博客网时间：2024/04/29 10:43

原文：http://blog.whiledo.com/archives/351

jqGrid的方法，从3.6开始已经完全兼容jQuery UI库。
用法：

<script>...jQuery("#grid_id").jqGridMethod( parameter1,...parameterN );...</script>

grid_id:表格的id；jqGridMethod：用到表格上的方法；parameter1,…parameterN ：参数列表
此方法并不是返回请求的数据值而是返回一个jqGrid对象。

<script>...jQuery("#grid_id").setGridParam({...}).hideCol("somecol").trigger("reloadGrid");...</script>

如果使用新的API：

<script>...jQuery("#grid_id").jqGrid('method', parameter1,...parameterN );...</script>

grid_id:表格id；jqGrid：表格实例；method：表格支持的方法名；parameter1,...parameterN ：参数列表

具体实例：

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

jqGrid配置使用新的api

<!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文件之前。

jqGrid方法

方法名参数返回值说明addJSONDatadatanone使用传来的data数据填充表格。使用方法：var mygrid = jQuery(”#”+grid_id)[0];var myjsongrid = eval(”(”+jsonresponse.responseText+”)”); mygrid.addJSONData(myjsongrid); myjsongrid = null; jsonresponse =null;addRowDatarowid,data, position, srcrowid成功为true, 否则为false根据参数插入一行新的数据，rowid为新行的id，data为新行的数据，position为新增行的位置，srcrowid为新增行的参考位置。data数据格式：{name1:value1,name2: value2…} name为在colModel中指定的名称addXMLDatadatanone根据传来的数据填充表格。用法：var mygrid = jQuery(”#”+grid_id)[0]; mygrid.addXmlData(xmlresponse.responseXML);clearGridDataclearfooterjqGrid对象清除表格当前加载的数据。如果clearfooter为true时则此方法删除表格最后一行的数据delRowDatarowid成功为true否则为false根据rowid删除行，但不会从服务器端删除数据footerDataaction,data, formatjgGrid对象设置或者取得底部数据。action：“get”或者“set”，默认为“get”，如果为“get”返回值为name:value，name为colModel中名称。如果为“set”则值为name：value，name是colModel中的名称。format：默认为true，当为true时，在设置新值时会调用formatter格式化数值getCellrowid, iCol单元格内容返回指定rowid，iCol的单元格内容，iCol既可以是当前列在colModel中的位置索引也可以是name值。注意：在编辑行或者单元格时不能使用此方法，此时返回的并不是改变的值，而是原始值getColcolname, returntype, mathoperationarray[] or value返回列的值。colname既可以是当前列在colModel中的位置索引也可以是name值。returntype指定返回数据的类型，默认为false。当为false时，返回的数组中只包含列的值，当为true时返回数组是对象数组，具体格式 {id:rowid, value:cellvalue} ，id为行的id，value为列的值。如： [{id:1,value:1},{id:2,value:2}…]。mathoperation 可选值为'sum, 'avg', 'count'getDataIDsnonearray[]返回当前grid里所有数据的idgetGridParamnamemixed value返回请求的参数信息getIndrowid,rowcontentmixed如果rowcontent为false，返回行所在的索引位置，id为行id。rowcontent默认为false。如果rowconent为ture则返回的为行对象，如果找不到行则返回falsegetRowDatarowid or nonearray{}返回指定行的数据，返回数据类型为name:value，name为colModel中的名称，value为所在行的列的值，如果根据rowid找不到则返回空。在编辑模式下不能用此方法来获取数据，它得到的并不是编辑后的值hideColcolnameor[colnames]jqGrid对象如果参数为一个列名则隐藏此列，如果给定的是数组则隐藏指定的所有列。格式： [“name1”,”name2”]remapColumnspermutation, updateCells, keepHeadernone调整表格列的显示顺序,permutation为当前列的顺序，假如值是[1,0,2]，那么第一列就会在第二位显示。如果updateCells为ture则是对单元格数据进行重新排序，如果keepHeader为true则对header数据显示位置进行调整resetSelectionnonejqGrid对象选择或者反选行数据，在多选模式下也同样起作用setCaptioncaptionjqGrid对象设置表格的标题setCellrowid,colname, data, class, propertiesjqGrid对象改变单元格的值。rowid：当前行id；colname：列名称，也可以是列的位置索引，从0开始；data：改变单元格的内容，如果为空则不更新；class：如果是string则会使用addClass方法将其加入到单元格的css中，如果是array则会直接加到style属性中；properties：设置单元格属性setGridParamobjectjqGrid对象设置grid的参数。有些参数的修改必须要重新加载grid才可以生效，这个方法可以覆盖事件setGridHeightnew_heightjqGrid对象动态改变grid的高度，只能对单元格的高度进行设置而不能对表格的高度进行动态修改。new_height：可以是象素值，百分比或者"auto"setGridWidthnew_width,shrinkjqGrid对象动态改变表格的宽度。new_width:表格宽度，象素值；shrink：true或者false，作用同shrinkToFitsetLabelcolname, data, class, propertiesjqGrid对象给指定列设置一个新的显示名称。colname：列名称，也可以是列的位置索引，从0开始；data：列显示名称，如果为空则不修改；class：如果是string则会使用addClass方法将其加入到单元格的css中，如果是array则会直接加到style属性中；properties：设置label的属性setRowDatarowid,data, cssprop成功true否则false更新行的值，rowid为行id。data值格式：{name1:value1,name2: value2…} name为colModel中名称；cssprop：如果是string则会使用addClass方法将其加入到行的css中，如果是array或者对象则会直接加到style属性中setSelectionrowid,onselectrowjqGrid对象选择或反选指定行。如果onselectrow为ture则会触发事件onSelectRow，onselectrow默认为tureshowColcolnamejqGrid显示列。colname可以是数组[“name1”,”name2”],但是name1或者name2必须是colModel中的nametrigger(“reloadGrid”)nonejqGrid对象重新加载当前表格，也会向服务器发起新的请求updateColumnsnonenone同步表格的宽度，用在表格拖拽时，用法：var mygrid=jQuery(”#grid_id”)[0];mygrid.updateColumns();

jqGrid的通用方法和设置
这些方法并不和jqGrid对象绑定，可以随意使用：

<script>...jQuery.jgrid.jqGridFunction( parameter1,...parameterN );...</script>

jgrid.jqGridFunction 是函数名
parameter1,…parameterN 参数列表

函数名参数返回值说明ajaxOptions空对象none这个函数可以改变jqgrid中用到的ajax请求参数，这个函数可以覆盖当前所有ajax请求设置。从3.6版本开始起有3个级别的ajax设置：第一个级别就是在模块中设置ajax请求；第二个级别就是通过此函数设置；第三级别的设置是控制全局ajax请求的设置：jQuery.extend(jQuery.ajax({method specific options}, ajaxOptions, ThirdLevelajaxSettinds)); 当然我们也可以单独设置ajax的参数jqIDstring解析后的string转义字符串，把两个反斜杠(\\)转化为单个反斜杠(\)jgrid.htmlDecodestring转换后string把转码后的字符串还原jgrid.htmlEncodestring编码后的string把字符串编码jgrid.formatstring格式化后string

简单字符串模板。用法：Example jQuery.jqgformat(“Please enter a value between {0} and {1}.”, 4

result : “Please enter a value between 4 and 8.”

jgrid.getCellIndexcellindex这个方法是用来修复在ie7里的一个bugjgrid.stringToDocxmlstringxmlDoc把xmlstring转换为dom对象jgrid.stripHtmlcontentnew_content去掉html标签返回标签中内容jgrid.parsejsonstring对象把一个jsonstring转换为json对象，

jqGrid的方法

方法名参数返回值说明filterGridgrid_id,paramsHTML对象构造jqGrid的查询界面。grid_id:表格id；params：参数filterToolbarparamsjqGrid对象同上。不同的是搜索输入框在header层下方getColPropcolnamearray{}返回指定列的属性集合。name为colModel中名称GridDestroygrid_id成功true否则false从dom上删除此gridGridUnloadgrid_id成功true否则false跟GridDestroy不同的是table对象跟pager对象并不会被删除，以便下次使用setGridStatestatejqGrid对象设置grid的状态，显示或者隐藏。这个方法不会触发onHeaderClick 事件。setColPropcolname, propertiesjqGrid对象设置新的属性，对于动态改变列属性是非常有用的，但是有些属性的修改并不会起效。用法：jQuery(”#grid_id”).setColProp('colname',{editoptions:{value:“True:False”}});sortGridcolname, reloadjqGrid对象按指定列进行排序。效果同setGridParam({sortname:'myname'}).trigger('reloadGrid'). 如果reload为true则会重新加载数据updateGridRowsdata,rowidname,jsonreader成功true否则为false修改表格中某行的数据，data数据格式：[{name:value,name1:value1…}, {name:value,name2:value2…}]，name为colModel中的名称；rowidname某行的名称。jsonreader：boolean值，默认false。如果为true则是定义数据的格式，data的值并不是name：value形式而只是value