jqGrid中文說明文檔——選項設置


jqGrid提供了大量的選項設置,開發者可以通過設置選項對應值來控制jqGrid,比如表格的寬度、高度、數據類型以及列名稱等等都是通過選項設置來完成的。jqGrid的選項一般是名稱:值(name:value)的形式,也可以是對象(object)及數組(array)的形式配置。

jqGrid選項(Option)

調用jqGrid只需要執行以下代碼:

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

options即jqGrid的選項設置,請參照以下表格。

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

ColModel API

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

 
jQuery("#gridid").jqGrid({ 
... 
   colModel: [ {name:'name1', index:'index1'...}{...}, ... ], 
... 
}); 
 
屬性 類型 描述 默認值
align string 定義表格單元格(非表頭)的對齊方式,可取值:left, center, right. left
classes string 此屬性用於定義列的類名,當有多個類名時,用空格間隔,例如:“class1 class2”。在表格的CSS中,有一個預定義的類ui-ellipsis用於定義特定的行 empty
datefmt string 日期格式,可用/,-和.。作為間隔符。y、Y、yyyy用於4位年,YY、yy用於2位的月,d、dd用於日期 Y-m-d
defval string 搜索字段的缺省值,此參數只用於自定義搜索是的初始值。 empty
editable boolean 定義字段是否可編輯,用於單元格編輯、行編輯和表單模式 false
editoptions array 根據edittype 參數定義可用的值數組 empty
editrules array 設置可編輯字段的補充規則 empty
edittype string 定義行編輯和表單模式的編輯類型,可以是text、textarea、select、checkbox、 password、button、image和file。 text
fixed boolean 若設為true,即使shrinkToFit設置為true,列寬也不允許重新計算。GridWidth方法改變表格寬度時,列寬也不會改變。 false
formoptions array 定義表單編輯的各種選項 empty
hidedlg boolean 若設置為true,該列將不出現在模式對話框中,用戶可以此控制列的顯示或隱藏 false
hidden boolean 定義初始化時,列是否隱藏。 false
index string 通過sidx參數設置排序時的索引名。 empty
key boolean 在未從服務器獲得ID的情況下,該列可設置為行ID。只有一列可設置該屬性,若出現多列,表格只采用將第一個設置了該屬性的列,其他列忽略。 false
label string 當colNames數組為空時,定義此列的標題。若colNames數組和此屬性都為空,標題為該列的name屬性值。 none
name string 設置列在表格中的唯一名稱,此屬性是必須的。或者使用保留字subgrid、cb和rn. Required
resizable boolean 定義是否可變列寬 true
sortable boolean 定義是否可以排序 true
sorttype mixed 當datatype為local時,用於定義排序列類型。可取int/integer(整數)、float/number/currency(小數)、date(日期)、text(文本) text
title boolean 當設置為false時,鼠標滑向單元格時不顯示title屬性 true
width number 設置列的初始寬度,可用pixels和百分比 150

 

來源於helloweba.com

http://www.helloweba.com/view-blog-162.html#col


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM