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

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

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

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

jqGrid選項(xiàng)(Option)

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

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

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

屬性	類型	描述	默認(rèn)值
ajaxGridOptions	object	此項(xiàng)用于設(shè)置當(dāng)表格設(shè)置獲得數(shù)據(jù)時(shí)，ajax的全局屬性，注意此項(xiàng)可能覆蓋所有當(dāng)前的ajax設(shè)置（包括error, complete和beforeSend 事件）。	empty
ajaxSelectOptions	object	此項(xiàng)用于設(shè)置在editoptions或searchoptions對(duì)象中通過dataUrl選擇元素時(shí)， ajax的全局屬性。	empty
altclass	string	交替行的類。此項(xiàng)僅當(dāng)altRows設(shè)置為true時(shí)有效。	ui-priority-secondary
altRows	boolean	設(shè)置為交替行表格	false
autoencode	boolean	當(dāng)設(shè)置為true時(shí)，對(duì)來(lái)自服務(wù)器的數(shù)據(jù)和提交數(shù)據(jù)進(jìn)行encodes編碼。如< 將被轉(zhuǎn)換為<	false
autowidth	boolean	當(dāng)設(shè)置為true時(shí)，表格寬度將自動(dòng)匹配到父元素的寬度。這個(gè)匹配只在表格建立時(shí)進(jìn)行，為了使表格在父元素寬度變化時(shí)也隨之變化，可以使用setGridWidth方法	false
caption	string	表格的標(biāo)題。顯示在Header上。若為空時(shí)將不會(huì)顯示。	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中顯示。名稱以逗號(hào)分隔，數(shù)量應(yīng)與colModel 數(shù)組數(shù)量相等	empty
data	array	以數(shù)組的形式保存本地?cái)?shù)據(jù)。	empty
datastr	string	當(dāng)datatype被設(shè)置為xmlstring或jsonstring時(shí)，為數(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ù)返回?cái)?shù)據(jù)	xml
deselectAfterSort	boolean	只適用于當(dāng)datatype為local時(shí)。當(dāng)一個(gè)排序被應(yīng)用時(shí)取消當(dāng)前選定行。	true
direction	string	表格中的書寫方向。“l(fā)tr”從左到右(缺省值)，“rtl”從右到左	ltr
editurl	string	定義行內(nèi)編輯地址URL	null
emptyrecords	string	當(dāng)返回(或當(dāng)前)數(shù)量為零時(shí)顯示的信息此項(xiàng)只用當(dāng)viewrecords 設(shè)置為true時(shí)才有效。
ExpandColClick	boolean	true時(shí)，點(diǎn)擊展開行的文字，treeGrid展開或收攏	true
ExpandColumn	string	指定用于張開treeGrid的列（名稱來(lái)自colModel），未設(shè)置即用第一列。此項(xiàng)只有當(dāng)treeGrid為true時(shí)有效.	null
footerrow	boolean	如果設(shè)置為true時(shí)，將生成一個(gè)表腳行，列數(shù)等于colModel	false
forceFit	boolean	如果設(shè)置為true，改變列寬，相鄰列也將調(diào)整以適應(yīng)整體表格，將不會(huì)出現(xiàn)水平滾動(dòng)條。	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)題不為空時(shí)可用。	true
hoverrows	boolean	表行是否有鼠標(biāo)懸停效果	true
jsonReader	array	JSON數(shù)據(jù)結(jié)構(gòu)數(shù)組
lastpage	integer	請(qǐng)求返回的總頁(yè)數(shù)	0
lastsort	integer	排序的列號(hào)（0開始）	0
loadonce	boolean	設(shè)置為true時(shí)，表格只一次讀取服務(wù)器數(shù)據(jù)（使用適當(dāng)datatype），之后，datatype 自動(dòng)變?yōu)閘ocal ，所有進(jìn)一步操作都在客戶端完成，pager功能（若存在）將失效。	false
loadtext	string	數(shù)據(jù)請(qǐng)求和排序時(shí)顯示的文本	Loading…
loadui	string	此項(xiàng)控制ajax進(jìn)程進(jìn)行時(shí)的動(dòng)作。Disable—取消jqGrid的進(jìn)程指示，可使用自定義的指示。 enable (缺省)—表格中間顯示loading。 block – 顯示“Loading”信息，禁用頁(yè)面上的所有功能，直到數(shù)據(jù)裝入完成。	enable
mtype	string	定義提交類型POST或GET	GET
multikey	string	此屬性只有當(dāng)multiselect為true時(shí)有效，定義多選時(shí)的組合鍵，可選值有： shiftKey ，altKey，ctrlKey	empty
multiboxonly	boolean	此屬性只有當(dāng)multiselect為true時(shí)有效，. Multiboxonly設(shè)置為true時(shí)，只有點(diǎn)擊checkbox時(shí)該行才被選中，點(diǎn)擊其他列，將清除當(dāng)前行的選中。	false
multiselect	boolean	此屬性設(shè)為true時(shí)啟用多行選擇，出現(xiàn)復(fù)選框	false
multiselectWidth	integer	若multiselect 為true時(shí)，定義多選列的寬度。	20
page	integer	設(shè)置請(qǐng)求初始頁(yè)的數(shù)量，此參數(shù)通過URL從服務(wù)器接受數(shù)據(jù)	1
pager	mixed	定義分頁(yè)瀏覽導(dǎo)航條。必須是一個(gè)HTML元素，如<div id="page"></div>	empty
pagerpos	string	定義表格瀏覽導(dǎo)航條的位置，缺省情況下建立一個(gè)包括3部分的導(dǎo)航條：頁(yè)碼，導(dǎo)航按鈕和記錄信息。	center
pgbuttons	boolean	定義導(dǎo)航激活時(shí)導(dǎo)航按鈕是否顯示。	true
pginput	boolean	定義導(dǎo)航欄是否有頁(yè)碼輸入框。	true
pgtext	string	當(dāng)前頁(yè)信息。第一個(gè)量為當(dāng)前頁(yè)，第二個(gè)量為總頁(yè)數(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。這個(gè)數(shù)組可使用這種形式{name1:value1…}。	empty
reccount	integer	只讀屬性。定義表格顯示的行數(shù)。切勿與records混淆。	0
recordpos	string	定義頁(yè)中記錄信息的位置，可以是left，center，right。	right
recordpos	object	交替行的類	true
records	integer	只讀屬性。定義從請(qǐng)求中獲得的記錄數(shù)	none
recordtext	string	可在頁(yè)面上顯示的提示信息，此文字只在viewrecords 為true是有效，并且當(dāng)記錄總數(shù)大于0時(shí)才顯示。此文字中{}中的內(nèi)容表示： {0} 該頁(yè)顯示的第一個(gè)記錄的記錄號(hào) {1} 該頁(yè)顯示的最后一個(gè)記錄的記錄號(hào) {2} 獲得的記錄總數(shù)
resizeclass	string	列可變大小時(shí)的類	empty
rowList	array[]	用于改變顯示行數(shù)的下拉列表框的元素?cái)?shù)組。	empty
rownumbers	boolean	若此屬性為true，表格左側(cè)將添加一用于顯示行數(shù)（從1開始）的列。此時(shí)colModel自動(dòng)擴(kuò)展出一個(gè)名為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í)，定義顯示行數(shù)的列的寬度。	25
savedRow	array	只讀屬性。用于行編輯和單元格編輯保存數(shù)據(jù)之前	empty
scroll	boolean or integer	創(chuàng)建動(dòng)態(tài)滾動(dòng)表格。當(dāng)設(shè)為啟用時(shí)，pager被禁用，可使用垂直滾動(dòng)條來(lái)裝入數(shù)據(jù)。	false
scrollOffset	integer	定義垂直滾動(dòng)條的寬度。	18
scrollrows	boolean	該項(xiàng)啟用時(shí)，用setSelection 選定一行，表格將滾動(dòng)到被選行可見。	false
selarrrow	array-[]	只讀屬性。當(dāng)multiselect 為true時(shí)，包含當(dāng)前選定的行。此為一維數(shù)組，值為表格中選定行的ID。	empty
selrow	string	只讀屬性。內(nèi)容是最后選定行的ID。如火應(yīng)用了排序或pagging，該值為null。	null
shrinkToFit	boolean or integer	該項(xiàng)描述計(jì)算每列相對(duì)于表格寬度的初始寬度的類型。若為true，并且設(shè)置了列寬度，則每列的寬度根據(jù)定義寬度縮放。若為false，并且設(shè)置了列寬度，表格寬度為設(shè)置寬度，列寬度不會(huì)重新計(jì)算，使用colModel中定義的值	true
sortable	object	啟用此項(xiàng)，允許使用鼠標(biāo)重新排序列。	true
sortname	string	從服務(wù)器讀取XML或JSON數(shù)據(jù)時(shí)初始的排序名，此名被加到URL中。	empty
sortorder	string	從服務(wù)器讀取XML或JSON數(shù)據(jù)時(shí)初始的排序類型，此類型被加到URL中。可選值為asc或desc。	asc
subGrid	boolean	設(shè)置為true，可使用子表格。啟用子表格，將在基本表的左邊將添加一列，并包含一個(gè)“+”圖像，用戶可以點(diǎn)擊擴(kuò)展行。	false
subGridModel	array-[]	該屬性用于描述子表格的模式，只有subGrid 為true時(shí)有效。它是一個(gè)用于描述子表格列的數(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ù)是一個(gè)包含兩個(gè)值的數(shù)組，第一個(gè)值使工具欄有效，第二個(gè)值相對(duì)位置（可以是top、bottom、both）。例如：設(shè)置toolbar為 [true,”both”]，將在表格的頭部和底部建立兩個(gè)工具欄，兩個(gè)工具欄位兩個(gè)DIV元素，頭部DIV元素的ID為“t_表格ID”，底部DIV元素的ID為“tb_表格ID”。若只有一個(gè)工具欄（top或bottom）時(shí)，DIV的ID為“t_表格ID”。	[false,'']
toppager	boolean	是否在表格上部顯示分頁(yè)條。	false
totaltime	integer	只讀參數(shù)。用于記錄裝入XML和JSON數(shù)據(jù)的時(shí)間。	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相對(duì)于根元素的級(jí)別。	0
url	string	請(qǐng)求數(shù)據(jù)的url地址	null
userData	array	此數(shù)組保存請(qǐng)求的自定義信息，可隨時(shí)使用	empty
userDataOnFooter	boolean	到為true時(shí)， userData直接放置在頁(yè)腳。	false
viewrecords	boolean	是否在瀏覽導(dǎo)航欄顯示記錄總數(shù)	false
viewsortcols	array	定義表頭中排序圖標(biāo)的外觀和行為。缺省為[false,'vertical',true]。第一個(gè)參數(shù)設(shè)定是否顯示所有定義了排序的列旁顯示圖標(biāo)。缺省的false表示只有當(dāng)前排序列旁的圖標(biāo)顯示。設(shè)為true可使所有可排序列都顯示圖標(biāo)。第二個(gè)參數(shù)設(shè)定排序圖標(biāo)如何放置。vertical為垂直放置，horizontal為水平放置。第三個(gè)參數(shù)設(shè)定點(diǎn)擊功能。True表示表頭點(diǎn)擊排序，false表示只點(diǎn)擊排序圖標(biāo)排序。若將此參數(shù)設(shè)為false時(shí)，請(qǐng)確保第一個(gè)參數(shù)為true，否則將無(wú)法排序。
width	number	若為設(shè)置，表格的寬度為colModel 中定義的所有列寬度的總和。若設(shè)置了該項(xiàng)，每列的初始寬度按照shrinkToFit 設(shè)置的值	none
xmlReader	array	描述預(yù)期的XML數(shù)據(jù)結(jié)構(gòu)的數(shù)組。

ColModel API

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

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

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

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