jqGrid中文文檔之選項(xiàng)設(shè)置

更新時間：2015年12月02日 11:37:05 投稿：mrr

jqGrid提供了大量的選項(xiàng)設(shè)置，開發(fā)者可以通過設(shè)置選項(xiàng)對應(yīng)值來控制jqGrid，比如表格的寬度、高度、數(shù)據(jù)類型以及列名稱等等都是通過選項(xiàng)設(shè)置來完成的

jqGrid提供了大量的選項(xiàng)設(shè)置，開發(fā)者可以通過設(shè)置選項(xiàng)對應(yīng)值來控制jqGrid，比如表格的寬度、高度、數(shù)據(jù)類型以及列名稱等等都是通過選項(xiàng)設(shè)置來完成的。jqGrid的選項(xiàng)一般是名稱：值（name:value）的形式，也可以是對象(object)及數(shù)組（array）的形式配置。

jqGrid選項(xiàng)(Option)

調(diào)用jqGrid只需要執(zhí)行以下代碼:

jQuery("#grid_id").jqGrid(options);

options即jqGrid的選項(xiàng)設(shè)置，請參照以下表格。

屬性	類型	描述	默認(rèn)值
ajaxGridOptions	object	此項(xiàng)用于設(shè)置當(dāng)表格設(shè)置獲得數(shù)據(jù)時，ajax的全局屬性，注意此項(xiàng)可能覆蓋所有當(dāng)前的ajax設(shè)置（包括error, complete和beforeSend 事件）。	empty
ajaxSelectOptions	object	此項(xiàng)用于設(shè)置在editoptions或searchoptions對象中通過dataUrl選擇元素時， ajax的全局屬性。	empty
altclass	string	交替行的類。此項(xiàng)僅當(dāng)altRows設(shè)置為true時有效。	ui-priority-secondary
altRows	boolean	設(shè)置為交替行表格	false
autoencode	boolean	當(dāng)設(shè)置為true時，對來自服務(wù)器的數(shù)據(jù)和提交數(shù)據(jù)進(jìn)行encodes編碼。如< 將被轉(zhuǎn)換為<	false
autowidth	boolean	當(dāng)設(shè)置為true時，表格寬度將自動匹配到父元素的寬度。這個匹配只在表格建立時進(jìn)行，為了使表格在父元素寬度變化時也隨之變化，可以使用setGridWidth方法	false
caption	string	表格的標(biāo)題。顯示在Header上。若為空時將不會顯示。	empty
cellLayout	integer	該屬性確定單元格的padding + border 寬度。通常不修改該屬性，但若表格的CSS中改變了td元素，該屬性需要修改。缺省值5表示paddingLef(2) + paddingRight(2) + borderLeft(1)=5	5
cellEdit	boolean	是否允許單元格編輯。	false
cellsubmit	string	確定單元格內(nèi)容保存方式是remote還是clientArray 。	'remote'
cellurl	string	單元格保存的url。	null
colModel	array	描述列參數(shù)數(shù)組。這是表格最重要的部分，詳見colModel API.	null
colNames	array[]	列名稱數(shù)組。該名稱將在Header中顯示。名稱以逗號分隔，數(shù)量應(yīng)與colModel 數(shù)組數(shù)量相等	empty
data	array	以數(shù)組的形式保存本地數(shù)據(jù)。	empty
datastr	string	當(dāng)datatype被設(shè)置為xmlstring或jsonstring時，為數(shù)據(jù)串。	null
datatype	string	定義表格希望獲得的數(shù)據(jù)的類型，有效值有： Xml —xml數(shù)據(jù) xmlstring—xml字符串 json—JSON數(shù)據(jù) jsonstring—JSON字符串 local—客戶端數(shù)據(jù)（數(shù)組） javascript—javascript數(shù)據(jù) function—函數(shù)返回數(shù)據(jù)	xml
deselectAfterSort	boolean	只適用于當(dāng)datatype為local時。當(dāng)一個排序被應(yīng)用時取消當(dāng)前選定行。	true
direction	string	表格中的書寫方向。“l(fā)tr”從左到右(缺省值)，“rtl”從右到左	ltr
editurl	string	定義行內(nèi)編輯地址URL	null
emptyrecords	string	當(dāng)返回(或當(dāng)前)數(shù)量為零時顯示的信息此項(xiàng)只用當(dāng)viewrecords 設(shè)置為true時才有效。
ExpandColClick	boolean	true時，點(diǎn)擊展開行的文字，treeGrid展開或收攏	true
ExpandColumn	string	指定用于張開treeGrid的列（名稱來自colModel），未設(shè)置即用第一列。此項(xiàng)只有當(dāng)treeGrid為true時有效.	null
footerrow	boolean	如果設(shè)置為true時，將生成一個表腳行，列數(shù)等于colModel	false
forceFit	boolean	如果設(shè)置為true，改變列寬，相鄰列也將調(diào)整以適應(yīng)整體表格，將不會出現(xiàn)水平滾動條。	false
gridstate	string	表格的當(dāng)前狀態(tài)。有visible或hidden	visible
gridview	boolean	設(shè)置為true將提高5~10倍的顯示速度。但不能再使用treeGrid, subGrid, 或afterInsertRow事件	false
grouping	boolean	是否設(shè)置表格組	false
height	mixed	表格高度。可為數(shù)值、百分比或auto	150
hiddengrid	boolean	如果設(shè)置為true，表格開始被隱藏，數(shù)據(jù)不被載入，只顯示標(biāo)題。當(dāng)?shù)谝淮吸c(diǎn)擊顯示/隱藏按鈕顯示表格，數(shù)據(jù)從服務(wù)器載入。	false
hidegrid	boolean	是否允許顯示/隱藏按鈕可用。只有標(biāo)題不為空時可用。	true
hoverrows	boolean	表行是否有鼠標(biāo)懸停效果	true
jsonReader	array	JSON數(shù)據(jù)結(jié)構(gòu)數(shù)組
lastpage	integer	請求返回的總頁數(shù)	0
lastsort	integer	排序的列號（0開始）	0
loadonce	boolean	設(shè)置為true時，表格只一次讀取服務(wù)器數(shù)據(jù)（使用適當(dāng)datatype），之后，datatype 自動變?yōu)閘ocal ，所有進(jìn)一步操作都在客戶端完成，pager功能（若存在）將失效。	false
loadtext	string	數(shù)據(jù)請求和排序時顯示的文本	Loading…
loadui	string	此項(xiàng)控制ajax進(jìn)程進(jìn)行時的動作。Disable—取消jqGrid的進(jìn)程指示，可使用自定義的指示。 enable (缺省)—表格中間顯示loading。 block – 顯示“Loading”信息，禁用頁面上的所有功能，直到數(shù)據(jù)裝入完成。	enable
mtype	string	定義提交類型POST或GET	GET
multikey	string	此屬性只有當(dāng)multiselect為true時有效，定義多選時的組合鍵，可選值有： shiftKey ，altKey，ctrlKey	empty
multiboxonly	boolean	此屬性只有當(dāng)multiselect為true時有效，. Multiboxonly設(shè)置為true時，只有點(diǎn)擊checkbox時該行才被選中，點(diǎn)擊其他列，將清除當(dāng)前行的選中。	false
multiselect	boolean	此屬性設(shè)為true時啟用多行選擇，出現(xiàn)復(fù)選框	false
multiselectWidth	integer	若multiselect 為true時，定義多選列的寬度。	20
page	integer	設(shè)置請求初始頁的數(shù)量，此參數(shù)通過URL從服務(wù)器接受數(shù)據(jù)	1
pager	mixed	定義分頁瀏覽導(dǎo)航條。必須是一個HTML元素，如<div id="page"></div>	empty
pagerpos	string	定義表格瀏覽導(dǎo)航條的位置，缺省情況下建立一個包括3部分的導(dǎo)航條：頁碼，導(dǎo)航按鈕和記錄信息。	center
pgbuttons	boolean	定義導(dǎo)航激活時導(dǎo)航按鈕是否顯示。	true
pginput	boolean	定義導(dǎo)航欄是否有頁碼輸入框。	true
pgtext	string	當(dāng)前頁信息。第一個量為當(dāng)前頁，第二個量為總頁數(shù)。
prmNames	array	缺省情況下prmNames: { page:“page”,rows:“rows”, sort: “sidx”,order: “sord”, search:“_search”, nd:“nd”, npage:null} 以POST方式發(fā)送到服務(wù)器，字段為： page，rows，sidx，sord，search，nd 例如要將sidx改為mysort，可寫成： prmNames: {sort: “mysort”}. 這樣提交到服務(wù)器的字符串就變?yōu)椋?page=1&rows=10&mysort=myindex&sord=asc 若將一些參數(shù)設(shè)為null，這些參數(shù)將不再發(fā)往服務(wù)器。例如prmNames: { nd:null} 則nd參數(shù)將不被發(fā)送。 Npage參數(shù)參見scroll option.	none
postData	array	此數(shù)組能直接傳遞到url。這個數(shù)組可使用這種形式{name1:value1…}。	empty
reccount	integer	只讀屬性。定義表格顯示的行數(shù)。切勿與records混淆。	0
recordpos	string	定義頁中記錄信息的位置，可以是left，center，right。	right
recordpos	object	交替行的類	true
records	integer	只讀屬性。定義從請求中獲得的記錄數(shù)	none
recordtext	string	可在頁面上顯示的提示信息，此文字只在viewrecords 為true是有效，并且當(dāng)記錄總數(shù)大于0時才顯示。此文字中{}中的內(nèi)容表示： {0} 該頁顯示的第一個記錄的記錄號 {1} 該頁顯示的最后一個記錄的記錄號 {2} 獲得的記錄總數(shù)
resizeclass	string	列可變大小時的類	empty
rowList	array[]	用于改變顯示行數(shù)的下拉列表框的元素數(shù)組。	empty
rownumbers	boolean	若此屬性為true，表格左側(cè)將添加一用于顯示行數(shù)（從1開始）的列。此時colModel自動擴(kuò)展出一個名為rn的元素。所以在colModel中不要定義rn。	false
rowNum	integer	表格中可見的記錄數(shù)。此參數(shù)通過url傳遞給服務(wù)器供檢索數(shù)據(jù)用。注意：若此參數(shù)設(shè)置為10，而服務(wù)器返回15條記錄，將只有10條記錄被裝入。若此參數(shù)被設(shè)置為-1，則此檢查失效	20
rownumWidth	integer	當(dāng)rownumbers為true時，定義顯示行數(shù)的列的寬度。	25
savedRow	array	只讀屬性。用于行編輯和單元格編輯保存數(shù)據(jù)之前	empty
scroll	boolean or integer	創(chuàng)建動態(tài)滾動表格。當(dāng)設(shè)為啟用時，pager被禁用，可使用垂直滾動條來裝入數(shù)據(jù)。	false
scrollOffset	integer	定義垂直滾動條的寬度。	18
scrollrows	boolean	該項(xiàng)啟用時，用setSelection 選定一行，表格將滾動到被選行可見。	false
selarrrow	array-[]	只讀屬性。當(dāng)multiselect 為true時，包含當(dāng)前選定的行。此為一維數(shù)組，值為表格中選定行的ID。	empty
selrow	string	只讀屬性。內(nèi)容是最后選定行的ID。如火應(yīng)用了排序或pagging，該值為null。	null
shrinkToFit	boolean or integer	該項(xiàng)描述計算每列相對于表格寬度的初始寬度的類型。若為true，并且設(shè)置了列寬度，則每列的寬度根據(jù)定義寬度縮放。若為false，并且設(shè)置了列寬度，表格寬度為設(shè)置寬度，列寬度不會重新計算，使用colModel中定義的值	true
sortable	object	啟用此項(xiàng)，允許使用鼠標(biāo)重新排序列。	true
sortname	string	從服務(wù)器讀取XML或JSON數(shù)據(jù)時初始的排序名，此名被加到URL中。	empty
sortorder	string	從服務(wù)器讀取XML或JSON數(shù)據(jù)時初始的排序類型，此類型被加到URL中?？蛇x值為asc或desc。	asc
subGrid	boolean	設(shè)置為true，可使用子表格。啟用子表格，將在基本表的左邊將添加一列，并包含一個“+”圖像，用戶可以點(diǎn)擊擴(kuò)展行。	false
subGridModel	array-[]	該屬性用于描述子表格的模式，只有subGrid 為true時有效。它是一個用于描述子表格列的數(shù)組。	empty
subGridType	mixed	用于定義子表格裝入的數(shù)據(jù)類型，若不定義，則使用與父表格同樣的數(shù)據(jù)類型。	null
subGridUrl	string	該屬性用于定義子表格獲得數(shù)據(jù)的URL。行的ID將鍵入此URL中，若要添加其他參數(shù)，可使用subGridModel 中的選項(xiàng)。	empty
subGridWidth	integer	定義子表格的列寬	20
toolbar	array	該參數(shù)定義表格的工具欄。參數(shù)是一個包含兩個值的數(shù)組，第一個值使工具欄有效，第二個值相對位置（可以是top、bottom、both）。例如：設(shè)置toolbar為 [true,”both”]，將在表格的頭部和底部建立兩個工具欄，兩個工具欄位兩個DIV元素，頭部DIV元素的ID為“t_表格ID”，底部DIV元素的ID為“tb_表格ID”。若只有一個工具欄（top或bottom）時，DIV的ID為“t_表格ID”。	[false,'']
toppager	boolean	是否在表格上部顯示分頁條。	false
totaltime	integer	只讀參數(shù)。用于記錄裝入XML和JSON數(shù)據(jù)的時間。	0
treedatatype	mixed	定義初始數(shù)據(jù)類型	null
treeGrid	boolean	啟用（禁用）TreeGrid。	false
treeGridModel	string	定義TreeGrid的方法?？梢允莕ested或adjacency。	nested
treeIcons	array	此數(shù)組設(shè)置TreeGrid中使用的圖標(biāo)。圖標(biāo)應(yīng)是UI theme中的有效圖標(biāo)。缺省為 {plus:'ui-icon-triangle-1-e',minus:'ui-icon-triangle-1-s',leaf:'ui-icon-radio-off'}
treeReader	array	擴(kuò)展表格的colModel。這里定義的字段將添加到colModel的尾部并隱藏。服務(wù)器將返回這些字段的值。
tree_root_level	numeric	確定treeGrid相對于根元素的級別。	0
url	string	請求數(shù)據(jù)的url地址	null
userData	array	此數(shù)組保存請求的自定義信息，可隨時使用	empty
userDataOnFooter	boolean	到為true時， userData直接放置在頁腳。	false
viewrecords	boolean	是否在瀏覽導(dǎo)航欄顯示記錄總數(shù)	false
viewsortcols	array	定義表頭中排序圖標(biāo)的外觀和行為。缺省為[false,'vertical',true]。第一個參數(shù)設(shè)定是否顯示所有定義了排序的列旁顯示圖標(biāo)。缺省的false表示只有當(dāng)前排序列旁的圖標(biāo)顯示。設(shè)為true可使所有可排序列都顯示圖標(biāo)。第二個參數(shù)設(shè)定排序圖標(biāo)如何放置。vertical為垂直放置，horizontal為水平放置。第三個參數(shù)設(shè)定點(diǎn)擊功能。True表示表頭點(diǎn)擊排序，false表示只點(diǎn)擊排序圖標(biāo)排序。若將此參數(shù)設(shè)為false時，請確保第一個參數(shù)為true，否則將無法排序。
width	number	若為設(shè)置，表格的寬度為colModel 中定義的所有列寬度的總和。若設(shè)置了該項(xiàng)，每列的初始寬度按照shrinkToFit 設(shè)置的值	none
xmlReader	array	描述預(yù)期的XML數(shù)據(jù)結(jié)構(gòu)的數(shù)組。

ColModel API

colModel屬性以數(shù)組的形式定義各個表格列。這是jqGrid中很重要的部分。語法為：

jQuery("#gridid").jqGrid({ 
... 
  colModel: [ {name:'name1', index:'index1'...}, {...}, ... ], 
... 
});

下面給大家介紹jqGrid提供的事件列表。

事件	參數(shù)	描述
afterInsertRow	rowid rowdata rowelem	此事件發(fā)生在每次插入行后 rowid 為插入的行ID rowdata 是被插入行的數(shù)據(jù)數(shù)組。格式為name:value對，name在colModel定義 rowelem 是應(yīng)答元素。xml為xml行，json為所有行數(shù)據(jù)。注意：若gridview 為true，此事件不會發(fā)生
beforeRequest	none	此事件發(fā)生在任何數(shù)據(jù)請求前，但當(dāng)datatype為function時不發(fā)生。
beforeSelectRow	rowid, e	此事件發(fā)生在用戶點(diǎn)擊行，選中該行前。 rowid 為行的ID，e為事件對象該事件將返回布爾值true（行被選中）或false（行未被選中）。
gridComplete	none	此事件發(fā)生在表格所有數(shù)據(jù)裝入和進(jìn)程完成后。與datatype參數(shù)及排序分頁等無關(guān)。
loadBeforeSend	xhr, settings	此事件發(fā)生在XMLHttpRequest被發(fā)送前，用于修改對象屬性（如headers）。 xhr 為XMLHttpRequest對象。
loadComplete	data	此事件發(fā)生在每個服務(wù)器請求后。xhr 為XMLHttpRequest對象。
loadError	xhr, status, error	此事件在請求失敗時發(fā)生。事件有3個參數(shù)： xhr 為XMLHttpRequest對象； Satus 為錯誤類型描述；error 為錯誤對象。
onCellSelect	rowid, iCol, cellcontent, e	此事件在點(diǎn)擊表格特定單元格時發(fā)生。 rowid 為行ID；iCol 為列索引； cellcontent 為單元格中內(nèi)容； e 點(diǎn)擊事件對象。
ondblClickRow	rowid, iRow, iCol, e	此事件發(fā)生在行雙擊后發(fā)生。 rowid為行ID；iRow 為行索引（勿與rowid混淆）； iCol為列索引； e 為事件對象。
onHeaderClick	gridstate	此事件發(fā)生在點(diǎn)擊顯示或隱藏表格后發(fā)生（hidegrid為true） gridstate為表格狀態(tài)，有visible和hidden兩個值
onPaging	pgButton	此事件發(fā)生在點(diǎn)擊page button后，填充數(shù)據(jù)前，及用戶輸入一個與當(dāng)前頁頁碼不同的新頁碼并回車時。
onRightClickRow	rowid, iRow, iCol, e	此事件發(fā)生在右擊行后。（此事件在Opera瀏覽器中無效） rowid為行ID；iRow為行索引（勿與rowid混淆） iCol為列索引； e為事件對象
onSelectAll	aRowids, status	此事件發(fā)生在點(diǎn)擊標(biāo)題的復(fù)選框時發(fā)生（multiselect為true） aRowids 選定行ID的數(shù)組（哪些行的復(fù)選框與頭復(fù)選框相同） status 頭復(fù)選框的選定的布爾值，true為選中，false為
onSelectRow	rowid, status	此事件發(fā)生在行點(diǎn)擊后 rowid 為行ID； status 為選擇狀態(tài)。當(dāng)multiselect為true時使用，當(dāng)行被選中時返回true；為選中時返回false。
onSortCol	index, iCol, sortorder	此事件發(fā)生在列排序被點(diǎn)擊之后，數(shù)據(jù)排序前 index 為colModel 中定義的索引名iCol 為列的索引號 sortorder 為新的排序方式，asc或desc
resizeStart	event, index	此事件發(fā)生在列被重新定義寬度時。 event 為事件對象；index 為在colModel 中定義的列索引。
resizeStop	newwidth, index	此事件發(fā)生在列被重新定義寬度后。 newwidth 為新的列寬度；index 為在colModel 中定義的列索引。
serializeGridData	postData	通過此事件可以序列化傳遞給ajax請求的的數(shù)據(jù)。此事件將返回一個以序列化的數(shù)據(jù)。若有自定義的數(shù)據(jù)（如JSON字符串、XML字符串）要發(fā)給服務(wù)器時，可使用該事件。