| 方法名 | 參數 | 返回值 | 說明 |
| addJSONData | data | none | 使用傳來的data數據填充表格。使用方法： var mygrid = jQuery(”#”+grid_id)[0]; var myjsongrid = eval(”(”+jsonresponse.responseText+”)”); mygrid.addJSONData(myjsongrid); myjsongrid = null; jsonresponse =null; |
| addRowData | rowid,data, position, srcrowid | 成功為true, 否則為false | 根據參數插入一行新的數據，rowid為新行的id，data為新行的數據，position為新增行的位置，srcrowid為新增行的參考位置。data數據格式：{name1:value1,name2: value2…} name為在colModel中指定的名稱 |
| addXMLData | data | none | 根據傳來的數據填充表格。用法：var mygrid = jQuery(”#”+grid_id)[0]; mygrid.addXmlData(xmlresponse.responseXML); |
| clearGridData | clearfooter | jqGrid對象 | 清除表格當前加載的數據。如果clearfooter為true時則此方法刪除表格最后一行的數據 |
| delRowData | rowid | 成功為true否則為false | 根據rowid刪除行，但不會從服務器端刪除數據 |
| footerData | action,data, format | jgGrid對象 | 設置或者取得底部數據。action：“get”或者“set”，默認為“get”，如果為“get”返回值為name:value，name為colModel中名稱。如果為“set”則值為name：value，name是colModel中的名稱。format：默認為true，當為 true時，在設置新值時會調用formatter格式化數值 |
| getCell | rowid, iCol | 單元格內容 | 返回指定rowid，iCol的單元格內容，iCol既可以是當前列在colModel中的位置索引也可以是name值。注意：在編輯行或者單元格時不能使用此方法，此時返回的並不是改變的值，而是原始值 |
| getCol | colname, returntype, mathoperation | array[] 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' |
| getDataIDs | none | array[] | 返回當前grid里所有數據的id |
| getGridParam | name | mixed value | 返回請求的參數信息 |
| getInd | rowid,rowcontent | mixed | 如果rowcontent為false，返回行所在的索引位置，id為行id。rowcontent默認為false。如果rowconent為ture則返回的為行對象，如果找不到行則返回false |
| getRowData | rowid or none | array[] | 返回指定行的數據，返回數據類型為name:value，name為colModel中的名稱，value為所在行的列的值，如果根據rowid找不到則返回空。在編輯模式下不能用此方法來獲取數據，它得到的並不是編輯后的值 |
| hideCol | colnameor[colnames] | jqGrid對象 | 如果參數為一個列名則隱藏此列，如果給定的是數組則隱藏指定的所有列。格式： [“name1”,”name2”] |
| remapColumns | permutation, updateCells, keepHeader | none | 調整表格列的顯示順序,permutation為當前列的順序，假如值是[1,0,2]，那么第一列就會在第二位顯示。如果updateCells為ture則是對單元格數據進行重新排序，如果keepHeader為true則對header數據顯示位置進行調整 |
| resetSelection | none | jqGrid對象 | 選擇或者反選行數據，在多選模式下也同樣起作用 |
| setCaption | caption | jqGrid對象 | 設置表格的標題 |
| setCell | rowid,colname, data, class, properties | jqGrid對象 | 改變單元格的值。rowid：當前行id；colname：列名稱，也可以是列的位置索引，從0開始；data：改變單元格的內容，如果為空則不更 新；class：如果是string則會使用addClass方法將其加入到單元格的css中，如果是array則會直接加到style屬性中；properties：設置單元格屬性 |
| setGridParam | object | jqGrid對象 | 設置grid的參數。有些參數的修改必須要重新加載grid才可以生效，這個方法可以覆蓋事件 |
| setGridHeight | new_height | jqGrid對象 | 動態改變grid的高度，只能對單元格的高度進行設置而不能對表格的高度進行動態修改。new_height：可以是象素值，百分比或者"auto" |
| setGridWidth | new_width,shrink | jqGrid對象 | 動態改變表格的寬度。new_width:表格寬度，象素值；shrink：true或者false，作用同shrinkToFit |
| setLabel | colname, data, class, properties | jqGrid對象 | 給指定列設置一個新的顯示名稱。colname：列名稱，也可以是列的位置索引，從0開始；data：列顯示名稱，如果為空則不修改；class：如果是 string則會使用addClass方法將其加入到單元格的css中，如果是array則會直接加到style屬性中；properties：設置 label的屬性 |
| setRowData | rowid,data, cssprop | 成功true否則false | 更新行的值，rowid為行id。data值格式：{name1:value1,name2: value2…} name為colModel中名稱；cssprop：如果是string則會使用addClass方法將其加入到行的css中，如果是array或者對象 則會直接加到style屬性中 |
| setSelection | rowid,onselectrow | jqGrid對象 | 選擇或反選指定行。如果onselectrow為ture則會觸發事件onSelectRow，onselectrow默認為ture |
| showCol | colname | jqGrid | 顯示列。colname可以是數組[“name1”,”name2”],但是name1或者name2必須是colModel中的name |
| trigger(“reloadGrid”) | none | jqGrid對象 | 重新加載當前表格，也會向服務器發起新的請求 |
| updateColumns | none | none | 同步表格的寬度，用在表格拖拽時，用法：var mygrid=jQuery(”#grid_id”)[0];mygrid.updateColumns(); |
jqGrid的通用方法和設置
這些方法並不和jqGrid對象綁定，可以隨意使用：
jQuery.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的參數 |
| jqID | string | 解析后的string | 轉義字符串，把兩個反斜杠(\\)轉化為單個反斜杠(\) |
| jgrid.htmlDecode | string | 轉換后string | 把轉碼后的字符串還原 |
| jgrid.htmlEncode | string | 編碼后的string | 把字符串編碼 |
| jgrid.format | string | 格式化后string | 簡單字符串模板。用法：Example jQuery.jqgformat(“Please enter a value between {0} and {1}.”, 4,result : “Please enter a value between 4 and 8.” |
| jgrid.getCellIndex | cell | index | 這個方法是用來修復在ie7里的一個bug |
| jgrid.stringToDoc | xmlstring | xmlDoc | 把xmlstring轉換為dom對象 |
| jgrid.stripHtml | content | new_content | 去掉html標簽返回標簽中內容 |
| jgrid.parse | jsonstring | 對象 | 把一個jsonstring轉換為json對象 |
其他方法
| 方法名 | 參數 | 返回值 | 說明 |
| filterGrid | grid_id,params | HTML對象 | 構造jqGrid的查詢界面。grid_id:表格id；params：參數 |
| filterToolbar | params | jqGrid對象 | 同上。不同的是搜索輸入框在header層下方 |
| getColProp | colname | array | 返回指定列的屬性集合。name為colModel中名稱 |
| GridDestroy | grid_id | boolean | 從dom上刪除此grid |
| GridUnload | grid_id | boolean | 跟GridDestroy不同的是table對象跟pager對象並不會被刪除，以便下次使用 |
| setGridState | state | jqGrid對象 | 設置grid的狀態，顯示或者隱藏。這個方法不會觸發onHeaderClick 事件。 |
| setColProp | colname, properties | jqGrid對象 | 設置新的屬性，對於動態改變列屬性是非常有用的，但是有些屬性的修改並不會起效。用法：jQuery(”#grid_id”).setColProp('colname',{editoptions:{value:“True:False”}}); |
| sortGrid | colname, reload | jqGrid對象 | 按指定列進行排序。效果同setGridParam({sortname:'myname'}).trigger('reloadGrid'). 如果reload為true則會重新加載數據 |
| updateGridRows | data,rowidname,jsonreader | boolean | 修改表格中某行的數據，data數據格式：[{name:value,name1:value1…}, {name:value,name2:value2…}]，name為colModel中的名稱；rowidname某行的名稱。 jsonreader：boolean值，默認false。如果為true則是定義數據的格式，data的值並不是name：value形式而只是 value |
1.clearGridData（clearfooter） 清除表格當前加載的數據。如果clearfooter為true時則此方法刪除表格最后一行的數據。
$('#jqgrid').clearGridData(true); //清除表格當前加載的數據
$("#searchbtn").click(function () {
$('#jqgrid').clearGridData(true);//刪除表格的最后一行
initTable();
});
$("#jqgrid").jqGrid('clearGridData');
2.addRowData（rowid,data, position, srcrowid） 根據參數插入一行新的數據，rowid為新行的id，data為新行的數據，position為新增行的位置，srcrowid為新增行的參考位置。data數據格式：{name1:value1,name2: value2…} name為在colModel中指定的名稱
var colModel = [ { name: 'legalPersonName', label: '法人', sortable: false }, { name: 'blCampusName', label: '校區', sortable: false }, { name: 'studentName', label: '學生姓名', sortable: false }, { name: 'invoiceHeaderName', label: '發票抬頭', sortable: false }, { name: 'blueCreateTime', label: '開票時間', sortable: false }, { name: 'blueCreateUserName', label: '開票人', sortable: false }, { name: 'amount', label: '開票金額', sortable: false }, { name: 'invoiceNumber', label: '發票號碼' } ]; var gridRowData = [{ id:data.id, legalPersonName: data.legalPersonName, blCampusName: data.blCampusName, studentName: data.studentName, invoiceHeaderName: data.invoiceHeaderName, blueCreateTime: data.blueCreateTime||data.createTime, blueCreateUserName: data.blueCreateUserName||data.createUserName, amount: data.amount, invoiceNumber: data.invoiceNumber||'-' }]; initEvent();
initData()； Util.modalExec(modal.parents('.modal'),initData); function initGrid() { gridContainer.html(gridHtm); modalJqgrid = modal.find('#modalLessonJqgrid'); var params = { datatype:"local", colModel: colModel, pager: '#pagejqgrid', sortorder: "desc", maxHeight:60 }; EduBoss.generateTable(modalJqgrid, params); $.each(gridRowData,function(i){ modalJqgrid.jqGrid('addRowData',gridRowData[i],gridRowData);//data數據格式：{name1:value1,name2: value2…} name為在colModel中指定的名稱 }) }
3.delRowData 根據rowid刪除行，但不會從服務器端刪除數據
jqgrid.jqGrid('delRowData', rowid);
4.getGridParam(option) option為jqgrid初始化的參數如：url，colModel，rowNum，selarrrow等
grid.jqGrid('getGridParam', 'colModel')//拿到colModel的參數信息
$jqgridCached.jqGrid('getGridParam','selarrrow');//拿到jgrid中所有選擇的數據的id
var ids = jQuery("#jqgrid").jqGrid('getGridParam', 'selarrrow');
if (ids.length === 0) {
Util.showAlert("請先選擇缺課學員", true);
return false;
}
function initTable() { EduBoss.generateTable(productInfoTable, { url:Api.getYingYeReportWebControllerSummary, colModel: colModel, nosort: true, footerrow: true, loadComplete: function () { //最底下統計欄 var sumObj = {}; // 匯總數據 var size = 0; $(productInfoTable.jqGrid('getGridParam', 'colModel')).each(function (i) { if (i == 0) { sumObj[$(this).attr('name')] = '合計'; //??怎么直接可以$(this).attr("name")?直接拿到了name對應的字符串了呢？ } //this是一個對象，$(this).attr("name")?
//productInfoTable.jqGrid('getGridParam', 'colModel') 返回的是一個數組，就是colModal
if ($(this).attr('sum')) { size++; sumObj[$(this).attr('name')] = parseFloat(productInfoTable.getCol($(this).attr('name'), false, 'sum')).toFixed(2); } }); if (size > 0) { productInfoTable.footerData('set', sumObj); } else { $(".footrow").remove(); } } }) }
var postData = grid.jqGrid("getGridParam", "postData");
grid.jqGrid("setGridParam", {page:1});
grid.jqGrid("setGridParam",{postData:EduBoss.commonUtils.tranFormVarToJson($("#frm"))}).trigger("reloadGrid")
var text = {yyy:"yys"};
console.log($(text).attr("yyy"))=》 為什么會輸出yys？
5.footerData(action,data, format) 設置或者取得底部數據。action：“get”或者“set”，默認為“get”，如果為“get”返回值為name:value，name為colModel中名稱。如果為“set”則值為name：value，name是colModel中的名稱。format：默認為true，當為 true時，在設置新值時會調用formatter格式化數值
loadComplete : function(data){ highchartsObj.loadData(); var sumObj = {}; // 匯總數據 var size = 0; $($("#jqgrid").jqGrid('getGridParam','colModel')).each(function(i){//遍歷每一列 if(i==0){ sumObj[$(this).attr('name')] = '合計'; } if($(this).attr('sum')){ size++; //var sumNum = ; sumObj[$(this).attr('name')] = parseFloat($("#jqgrid").getCol($(this).attr('name'),false,'sum')).toFixed(0); } }); if(size > 0){ $("#jqgrid").footerData('set', sumObj); }else{ $(".footrow").remove(); } },
6.getCol（colname, returntype, mathoperation）返回列的值。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'
7.getCell (rowid, iCol) 返回指定rowid，iCol的單元格內容，iCol既可以是當前列在colModel中的位置索引也可以是name值。注意：在編輯行或者單元格時不能使用此方法，此時返回的並不是改變的值，而是原始值
8.getDataIDs() 返回當前grid里所有數據的id
loadComplete: function () { var ids = jqgrid.jqGrid('getDataIDs'); for (var i = 0; i < ids.length; i++) { var cl = ids[i]; var row = jqgrid.jqGrid('getRowData', cl); } }
9.getRowData(rowid or none) 返回指定行的數據，返回數據類型為name:value，name為colModel中的名稱，也就是name。value為所在行的列的值，如果根據rowid找不到則返回空。在編輯模式下不能用此方法來獲取數據，它得到的並不是編輯后的值
var row = jqgrid.jqGrid('getRowData', cl);
10.setGridParam （object） 設置grid的參數。有些參數的修改必須要重新加載grid才可以生效，這個方法可以覆蓋事件
if(jqgrid.parents(".ui-corner-all").length > 0){ //要等table加載出來后再重新設置他的postData才有效 jqgrid.jqGrid("setGridParam", { postData: {"studentId":studentId} }).trigger("reloadGrid"); }
function search(){ var params = EduBoss.commonUtils.tranFormVarToJson(_form); params["id"] = schoolId; params["region.id"] = regionId; params["schoolType.id"] = schoolTypeId; jqgrid.jqGrid("setGridParam", {page : 1}); jqgrid.jqGrid("setGridParam",{postData : params}).trigger("reloadGrid"); }
11.getGridParam
12.setRowData（rowid,data, cssprop） 更新行的值，rowid為行id。data值格式：{name1:value1,name2: value2…} name為colModel中對應的每一個name對應的值；cssprop：如果是string則會使用addClass方法將其加入到行的css中，如果是array或者對象 則會直接加到style屬性中
jqgrid.jqGrid('setRowData', ids[i], {
act: actStr
});
{ name: 'legalPersonName', label: '法人', width: 10, sortable:false },
{ name: 'blCampusName', label: '校區', fixedFlag: true, sortable: false },
$("#orgGrid").jqGrid('setRowData',ids[i],{'legalPersonName':"2008-10-01",phone:"test",'blCampusName':"note",orgName:"200.00"});//根據Id主鍵，更新對應的數據
13.setSelection （rowid,onselectrow） 選擇或反選指定行。如果onselectrow為ture則會觸發事件onSelectRow，onselectrow默認為ture
onSelectRow: function (rowid) { var selectId = jqgridCustomer.jqGrid('getGridParam', 'selarrrow')[0]; selectId === rowid || jqgridCustomer.setSelection(selectId, false); console.log(jqgridCustomer.setSelection(selectId, false)) },
14.trigger(“reloadGrid”) 重新加載當前表格，也會向服務器發起新的請求