合作(zuò)
咨詢
建站(zhàn)咨詢
jqGrid中文說明(míng)文檔——事件和(hé)方法
- 作(zuò)者：admin
- 發表時(shí)間(jiān)：2013-07-02 14:17:08
- 來(lái)源：未知
jqGrid提供了大(dà)量的事件和(hé)方法可(kě)以調用，方便開(kāi)發者通(tōng)過事件響應處理(lǐ)以及動态的調用方法來(lái)對jqGrid表格的操作(zuò)，滿足不同情況下的開(kāi)發需求。了解jqGrid選項、事件及方法後，你(nǐ)可(kě)以盡情發揮，讓jqGrid為(wèi)你(nǐ)做(zuò)更多(duō)的事情。
jqGrid事件(Events)
通(tōng)過事件響應來(lái)設置jqGrid的表格屬性，其使用語法為(wèi)：
var lastSel;
jQuery("#gridid").jqGrid({
...
onSelectRow: function(id){
if(id && id!==lastSel){
jQuery('#gridid').restoreRow(lastSel);
lastSel=id;
}
jQuery('#gridid').editRow(id, true);
},
...
});
上(shàng)述代碼表明(míng)，當選中表格中的行(xíng)時(shí)将要發生(shēng)的事情。以下是jqGrid提供的事件列表。
| 事件 | 參數(shù) | 描述 |
| afterInsertRow |
rowid? rowdata? rowelem |
此事件發生(shēng)在每次插入行(xíng)後 rowid 為(wèi)插入的行(xíng)ID rowdata 是被插入行(xíng)的數(shù)據數(shù)組。格式為(wèi)name:value對，name在colModel定義 rowelem 是應答(dá)元素。xml為(wèi)xml行(xíng)，json為(wèi)所有(yǒu)行(xíng)數(shù)據。 注意：若gridview 為(wèi)true，此事件不會(huì)發生(shēng) |
| beforeRequest | none | 此事件發生(shēng)在任何數(shù)據請(qǐng)求前，但(dàn)當datatype為(wèi)function時(shí)不發生(shēng)。 |
| beforeSelectRow | rowid, e |
此事件發生(shēng)在用戶點擊行(xíng)，選中該行(xíng)前。 rowid 為(wèi)行(xíng)的ID，e為(wèi)事件對象 該事件将返回布爾值true（行(xíng)被選中）或false（行(xíng)未被選中）。 |
| gridComplete | none | 此事件發生(shēng)在表格所有(yǒu)數(shù)據裝入和(hé)進程完成後。與datatype參數(shù)及排序分頁等無關。 |
| loadBeforeSend |
xhr, settings |
此事件發生(shēng)在XMLHttpRequest被發送前，用于修改對象屬性（如headers）。 xhr 為(wèi)XMLHttpRequest對象。 |
| loadComplete | data | 此事件發生(shēng)在每個(gè)服務器(qì)請(qǐng)求後。xhr 為(wèi)XMLHttpRequest對象。 |
| loadError |
xhr, status, error |
此事件在請(qǐng)求失敗時(shí)發生(shēng)。事件有(yǒu)3個(gè)參數(shù)： xhr 為(wèi)XMLHttpRequest對象； Satus 為(wèi)錯誤類型描述；error 為(wèi)錯誤對象。 |
| onCellSelect |
rowid, iCol,? cellcontent, e |
此事件在點擊表格特定單元格時(shí)發生(shēng)。 rowid 為(wèi)行(xíng)ID；iCol 為(wèi)列索引； cellcontent 為(wèi)單元格中內(nèi)容； e 點擊事件對象。 |
| ondblClickRow |
rowid,? iRow,? iCol,? e |
此事件發生(shēng)在行(xíng)雙擊後發生(shēng)。 rowid為(wèi)行(xíng)ID；iRow?為(wèi)行(xíng)索引（勿與rowid混淆）； iCol為(wèi)列索引； e 為(wèi)事件對象。 |
| onHeaderClick | gridstate | 此事件發生(shēng)在點擊顯示或隐藏表格後發生(shēng)（hidegrid為(wèi)true） gridstate為(wèi)表格狀态，有(yǒu)visible和(hé)hidden兩個(gè)值 |
| onPaging | pgButton | 此事件發生(shēng)在點擊page button後，填充數(shù)據前，及用戶輸入一個(gè)與當前頁頁碼不同的新頁碼并回車(chē)時(shí)。 |
| onRightClickRow |
rowid,? iRow,? iCol,? e |
此事件發生(shēng)在右擊行(xíng)後。（此事件在Opera浏覽器(qì)中無效） rowid為(wèi)行(xíng)ID；iRow為(wèi)行(xíng)索引（勿與rowid混淆） iCol為(wèi)列索引； e為(wèi)事件對象 |
| onSelectAll |
aRowids, status |
此事件發生(shēng)在點擊标題的複選框時(shí)發生(shēng)（multiselect為(wèi)true） aRowids 選定行(xíng)ID的數(shù)組（哪些(xiē)行(xíng)的複選框與頭複選框相同） status 頭複選框的選定的布爾值，true為(wèi)選中，false為(wèi) |
| onSelectRow |
rowid, status |
此事件發生(shēng)在行(xíng)點擊後 rowid?為(wèi)行(xíng)ID； status? 為(wèi)選擇狀态。當multiselect為(wèi)true時(shí)使用，當行(xíng)被選中時(shí)返回true；為(wèi)選中時(shí)返回false。 |
| onSortCol |
index, iCol, sortorder |
此事件發生(shēng)在列排序被點擊之後，數(shù)據排序前 index 為(wèi)colModel 中定義的索引名iCol 為(wèi)列的索引号 sortorder 為(wèi)新的排序方式，asc或desc |
| resizeStart | event, index | 此事件發生(shēng)在列被重新定義寬度時(shí)。 event 為(wèi)事件對象；index 為(wèi)在colModel 中定義的列索引。 |
| resizeStop | newwidth, index |
此事件發生(shēng)在列被重新定義寬度後。 newwidth 為(wèi)新的列寬度；index 為(wèi)在colModel 中定義的列索引。 |
| serializeGridData | postData | 通(tōng)過此事件可(kě)以序列化傳遞給ajax請(qǐng)求的的數(shù)據。此事件将返回一個(gè)以序列化的數(shù)據。若有(yǒu)自定義的數(shù)據（如JSON字符串、XML字符串）要發給服務器(qì)時(shí)，可(kě)使用該事件。 |
關于單元格編輯、子表的事件情參閱Cell Editing,?subGrid
jqGrid方法(Methods)
調用jqGrid的方法很(hěn)簡單，使用以下代碼：
jQuery("#grid_id").jqGridMethod( parameter1,...parameterN );
這裏：grid_id是表格的id；
jqGridMethod為(wèi)jqGrid方法；
parameter1,…parameterN為(wèi)參數(shù)列表
若方法未定義返回值，則返回到jqGrid對象，一組方法可(kě)以鏈接起來(lái)，例如
jQuery("#grid_id").setGridParam({...}).hideCol("somecol").trigger("reloadGrid");
或使用新的接口
jQuery("#grid_id").jqGrid('method', parameter1,...parameterN );
這裏： grid_id是表格的id；
Method是方法名；
parameter1,…parameterN是參數(shù)列表。
以下是jqGrid提供的一系列方法：
| 方法 | 參數(shù) | 返回值 | 描述 |
| addJSONData | data | none |
用傳遞的data（數(shù)組）填充網格。用法：假如我們從web服務器(qì)獲得(de)的數(shù)據（jsonresponse），則 var mygrid = jQuery(”#”+grid_id)[0]; var myjsongrid = eval(”(”+jsonresponse.responseText+”)”); mygrid.addJSONData(myjsongrid); myjsongrid = null; jsonresponse =null; 将填充網格。當然，myjsongrid中的數(shù)據在傳遞到addJSONData之前可(kě)以被操作(zuò)。 |
| addRowData |
rowid, data,? position,? srcrowid |
true on success,? false otherwise |
插入一新行(xíng)，rowid 為(wèi)新行(xíng)的ID，data（數(shù)組）為(wèi)新行(xíng)數(shù)據，position為(wèi)新行(xíng)插入的位置（first為(wèi)表頭，last為(wèi)表尾，srcrowid指定偏移位置）。Data數(shù)組的格式為(wèi)：{name1:value1,name2: value2…} ，name為(wèi)colModel指定的名稱。 |
| addXmlData | data | none |
用傳入的data填充網格。用法：假如我們從web服務器(qì)獲得(de)數(shù)據 (xmlresponse)，則 var mygrid = jQuery(”#”+grid_id)[0]; mygrid.addXmlData(xmlresponse.responseXML); 将填充網格。當然，xmlresponse中的數(shù)據在傳遞到addXmlData之前可(kě)以被操作(zuò)。 |
| clearGridData | clearfooter | jqGrid object | 清除網格中當前裝入的數(shù)據，如果clearfooter 參數(shù)為(wèi)true，則清除網格最後一行(xíng)數(shù)據。 |
| delRowData | rowid |
true on success,? false otherwise |
删除id = rowid的行(xíng)。但(dàn)不會(huì)删除服務器(qì)上(shàng)的數(shù)據。 |
| footerData |
action, data,? format |
jqGrid object |
此方法獲得(de)或設置網格底部數(shù)據。 action – 可(kě)設置為(wèi)get（缺省）或set。 Get從底部返回name:value對象（name為(wèi)colModel中的名稱）。此時(shí)其他兩個(gè)參數(shù)無效。 Set将data數(shù)組（對象）設置到底部。Data為(wèi)colName中的名稱和(hé)值對。 format – 缺省為(wèi)true，表示設置時(shí)使用formatter (如果colModel中已定義)。false表示不使用formatter |
| getCell |
rowid,? iCol |
cell content | 返回id = rowid行(xíng)，column = iCol列的內(nèi)容。 iCol可(kě)以是列的索引或colName中定義的名稱。在編輯行(xíng)或列時(shí)不能使用該方法，此時(shí)返回的不是當前值，而是原始值。 |
| getCol | colname, returntype, mathoperation | array[] or value |
返回列值數(shù)組。 colname 可(kě)以是列的索引值或colModel中的名稱。returntype 确定返回數(shù)組的類型，為(wèi)false(缺省)時(shí)，數(shù)組隻包含值。為(wèi)true時(shí)為(wèi)對象數(shù)組，格式為(wèi){id:rowid, value:cellvalue}，id為(wèi)行(xíng)的id， cellvalue為(wèi)單元格的值。如 [{id:1,value:1},{id:2,value:2}…] mathoperation為(wèi)可(kě)選參數(shù)，可(kě)以是sum、avg和(hé)count。若此參數(shù)進行(xíng)了有(yǒu)效設置，則返回計(jì)算(suàn)後的值，若無效，則返回空(kōng)數(shù)組。 |
| getDataIDs | none | array[] | 返回當前網格顯示數(shù)據的ID數(shù)組。無數(shù)據時(shí)返回空(kōng)數(shù)組。 |
| getGridParam | name | mixed value | 返回請(qǐng)求的參數(shù)的值。name 是options 數(shù)組中的名稱，若為(wèi)設置則options被返回。 詳見jqGrid中文說明(míng)文檔——選項設置. |
| getInd |
rowid, rowcontent |
mixed | 當rowcontent 設置為(wèi)false（缺省）時(shí)，返回id= rowid行(xíng)的索引值。若rowcontent設置為(wèi)true，則返回整行(xíng)。若為(wèi)找到rowid則返回false。 |
| getLocalRow | rowid | row object | Return the row data from the local array stored in data parameter when the datatype is local |
| getRowData | rowid or none | array{} |
返回id = rowid行(xíng)的數(shù)據數(shù)組。格式為(wèi)name:value對，name為(wèi)colModel中的名稱，value為(wèi)該行(xíng)的值。未找到返回空(kōng)數(shù)組。在行(xíng)或列編輯時(shí)此方法不可(kě)用，此時(shí)返回的不是當前值，而是原始值。 若rowid為(wèi)設置，則返回網格中所有(yǒu)數(shù)據數(shù)組。 |
| hideCol |
colname or [colnames] |
jqGrid object | 根據colname或colnames數(shù)組給定的列名隐藏相應的列，列名必須是colModel中定義的名稱。表格的寬度不會(huì)改變。 |
| remapColumns | permutation, updateCells, keepHeader | none | 調整列的顯示順序。permutation指定調整後的順序，如 [1,0,2] 表示第一列在第二位顯示。若updateCells 設置為(wèi)true，列數(shù)據将重新排序。若keepHeader 設置為(wèi)true，header單元格将重新排序。 |
| resetSelection | none | jqGrid object | 選擇（反選）行(xíng)。多(duō)選擇模式下同樣可(kě)用。 |
| setCaption | caption | jqGrid object | 設置新的表頭文字。若表頭為(wèi)隐藏，将顯示。 |
| setCell |
rowid, colname,? data,? class,? properties,? forceup |
jqGrid object |
修改單元格的值、類或樣式。其中： rowid為(wèi)行(xíng)ID；colname為(wèi)列名（可(kě)以是從0開(kāi)始的列的索引值）； data 設置的內(nèi)容，若為(wèi)空(kōng)，class若為(wèi)字符串，将使用addClass為(wèi)列加入一個(gè)類，若為(wèi)數(shù)組，将直接加入CSS中；properties 設置單元格屬性。 |
| setGridParam | object | jqGrid object |
設置一個(gè)特定的參數(shù)。 有(yǒu)些(xiē)參數(shù)需trigger(“reloadGrid”)才能生(shēng)效。注意這個(gè)方法可(kě)以覆蓋事件。名稱（name:value對）為(wèi)選項數(shù)組中的名稱。 選項信息參見jqGrid中文說明(míng)文檔——選項設置. |
| setGridHeight | new_height | jqGrid object | 動态設置網格高(gāo)度。隻能對單元格的高(gāo)度進行(xíng)設置而不是網格。new_height 可(kě)以是像素、百分比或auto。 |
| setGridWidth |
new_width, shrink |
jqGrid object |
動态設置網格寬度。new_width 為(wèi)新寬度的像素值； shrink（true或false）作(zuò)用同shrinkToFit。若不設置，則使用shrinkToFit設置。 |
| setLabel |
colname,? data,? class,? properties |
jqGrid object |
設置指定列标題文字、屬性和(hé)類： colname 為(wèi)列名，可(kě)以是從0開(kāi)始的列索引； data 為(wèi)标題文字，為(wèi)空(kōng)則不修改； class 若為(wèi)字符串，則為(wèi)類名，若為(wèi)數(shù)組，則直接寫入CSS； properties 為(wèi)标題文字的屬性。 |
| setRowData |
rowid, data,? cssprop |
true on success,? false otherwise |
更新rowid指定行(xíng)的數(shù)據（使用數(shù)組）。 Data數(shù)組的格式為(wèi): {name1:value1,name2: value2…} 。name為(wèi)colModel中描述的名稱，value為(wèi)新值。cssprop若為(wèi)字符串，将使用addClass為(wèi)行(xíng)添加類；若為(wèi)數(shù)組對象，則直接加入CSS中。将data設置為(wèi)false的情況下，可(kě)設置屬性和(hé)類名 |
| setSelection |
rowid, onselectrow |
jqGrid object | 選擇或反選id = rowid指定的行(xíng)。若onselectrow設置為(wèi)true (缺省) 則觸發onSelectRow事件，否則不觸發。 |
| showCol | colname | jqGrid object | 顯示colname 指定的列。若colname為(wèi)字符串，隻顯示指定的列，若colname為(wèi)數(shù)組 [“name1”,”name2”] 則顯示name1和(hé)name2列， name必須是colModel中的名稱。寬度不變。 |
| trigger(“reloadGrid”) | none | none | 按當前設置重新加載網格。若datatype為(wèi)xml或json，将從服務器(qì)重新請(qǐng)求數(shù)據。此方法适用于一個(gè)已建立的網格。注意不會(huì)改變表頭，也就是說改變colModel将沒有(yǒu)作(zuò)用。你(nǐ)可(kě)用gridUnload，使用新colModel來(lái)重新加載。 |
| updateColumns | none | none |
在拖拽表格時(shí)，同步網格寬度。用法： var mygrid=jQuery(”#grid_id”)[0]; mygrid.updateColumns(); |
聯系我們
一切良好工作(zuò)的開(kāi)始，都需相互之間(jiān)的溝通(tōng)搭橋，歡迎咨詢。
