名稱

類型

描述

預設值

可修改

url

string

獲取數據的地址

datatype

string

從伺服器端返回的數據類型，預設xml。可選類型：xml，local，json，jsonnp，script，xmlstring，jsonstring，clientside

mtype

string

ajax提交方式。POST或者GET，預設GET

colNames

Array

列顯示名稱，是一個數組對象

colModel

Array

常用到的屬性：name 列顯示的名稱；index 傳到伺服器端用來排序用的列名稱；width 列寬度；align 對齊方式；sortable 是否可以排序

pager

string

定義翻頁用的導航欄，必須是有效的html元素。翻頁工具欄可以放置在html頁面任意位置

rowNum

int

在grid上顯示記錄條數，這個參數是要被傳遞到後臺

rowList

array

一個下拉選擇框，用來改變顯示記錄數，當選擇時會覆蓋rowNum參數傳遞到後臺

sortname

string

預設的排序列。可以是列名稱或者是一個數字，這個參數會被提交到後臺

viewrecords

boolean

定義是否要顯示總記錄數

caption

string

表格名稱

ajaxGridOptions[a1] 

object

對ajax參數進行全局設置，可以覆蓋ajax事件

null

是

ajaxSelectOptions[a2] 

object

對ajax的select參數進行全局設置

null

是

altclass

String

用來指定行顯示的css，可以編輯自己的css文件，只有當altRows設為 ture時起作用

ui-priority-secondary

altRows

boolean

設置表格 zebra-striped 值

autoencode

boolean

對url進行編碼

false

是

autowidth

boolean

如果為ture時，則當表格在首次被創建時會根據父元素比例重新調整表格寬度。如果父元素寬度改變，為了使表格寬度能夠自動調整則需要實現函數：setGridWidth

false

否

cellLayout

integer

定義了單元格padding + border 寬度。通常不必修改此值。初始值為

5

是

cellEdit

boolean

啟用或者禁用單元格編輯功能

false

是

cellsubmit

String

定義了單元格內容保存位置

‘remote’

是

cellurl

String

單元格提交的url

空值

是

datastr

String

xmlstring或者jsonstring

空值

是

deselectAfterSort

boolean

只有當datatype為local時起作用。當排序時不選擇當前行

true

是

direction

string

表格中文字的顯示方向，從左向右（ltr）或者從右向左（rtr）

ltr

否

editurl

string

定義對form編輯時的url

空值

是

emptyrecords

string

當返回的數據行數為0時顯示的信息。只有當屬性 viewrecords 設置為ture時起作用

是

ExpandColClick

boolean

當為true時，點擊展開行的文本時，treeGrid就能展開或者收縮，不僅僅是點擊圖片

true

否

ExpandColumn

string

指定那列來展開tree grid，預設為第一列，只有在treeGrid為true時起作用

空值

否

footerrow[a3] 

boolean

當為true時，會在翻頁欄之上增加一行

false

否

forceFit

boolean

當為ture時，調整列寬度不會改變表格的寬度。當shrinkToFit 為false時，此屬性會被忽略

false

否

gridstate

string

定義當前表格的狀態：'visible' or 'hidden'

visible

否

gridview

boolean

構造一行數據後添加到grid中，如果設為true則是將整個表格的數據都構造完成後再添加到grid中，但treeGrid, subGrid, or afterInsertRow 不能用

false

是

height

mixed

表格高度，可以是數字，像素值或者百分比

150

否

hiddengrid

boolean

當為ture時，表格不會被顯示，只顯示表格的標題。只有當點擊顯示表格的那個按鈕時才會去初始化表格數據。

false

否

hidegrid

boolean

啟用或者禁用控製表格顯示、隱藏的按鈕，只有當caption 屬性不為空時起效

true

否

hoverrows

boolean

當為false時mouse hovering會被禁用

false

是

jsonReader

array

描述json 數據格式的數組

否

lastpage

integer

只讀屬性，定義了總頁數

0

否

lastsort

integer

只讀屬性，定義了最後排序列的索引，從0開始

0

否

loadonce

boolean

如果為ture則數據只從伺服器端抓取一次，之後所有操作都是在客戶端執行，翻頁功能會被禁用

false

否

loadtext

string

當請求或者排序時所顯示的文字內容

Loading....

否

loadui

string

當執行ajax請求時要乾什麼。disable禁用ajax執行提示；enable預設，當執行ajax請求時的提示； block啟用Loading提示，但是阻止其他操作

enable

是

multikey

string

只有在multiselect設置為ture時起作用，定義使用那個key來做多選。shiftKey，altKey，ctrlKey

空值

是

multiboxonly

boolean

只有當multiselect = true.起作用，當multiboxonly 為ture時只有選擇checkbox才會起作用

false

是

multiselect

boolean

定義是否可以多選

false

否

multiselectWidth

integer

當multiselect為true時設置multiselect列寬度

20

否

page

integer

設置初始的頁碼

1

是

pagerpos

string

指定分頁欄的位置

center

否

pgbuttons

boolean

是否顯示翻頁按鈕

true

否

pginput

boolean

是否顯示跳轉頁面的輸入框

true

否

pgtext

string

當前頁信息

是

prmNames

array

Default valuesprmNames: {page:“page”,rows:“rows”, sort: “sidx”,order: “sord”, search:“_search”, nd:“nd”, npage:null} 當參數為null時不會被髮到伺服器端

none

是

postData

array

此數組內容直接賦值到url上，參數類型：{name1:value1…}

空array

是

reccount

integer

只讀屬性，定義了grid中確切的行數。通常情況下與records屬性相同，但有一種情況例外，假如rowNum=15，但是從伺服器端返回的記錄數是20，那麼records值是20，但reccount值仍然為15，而且表格中也只顯示15條記錄。

0

否

recordpos

string

定義了記錄信息的位置： left, center, right

right

否

records

integer

只讀屬性，定義了返回的記錄數

none

否

recordtext

string

顯示記錄數信息。{0} 為記錄數開始，{1}為記錄數結束。viewrecords為ture時才能起效，且總記錄數大於0時才會顯示此信息

resizeclass

string

定義一個class到一個列上用來顯示列寬度調整時的效果

空值

否

rowList

array

一個數組用來調整表格顯示的記錄數，此參數值會替代rowNum參數值傳給伺服器端。

[]

否

rownumbers

boolean

如果為ture則會在表格左邊新增一列，顯示行順序號，從1開始遞增。此列名為'rn'.

false

否

rownumWidth

integer

如果rownumbers為true，則可以設置column的寬度

25

否

savedRow

array

只讀屬性，只用在編輯模式下保存數據

空值

否

scroll

boolean

創建一個動態滾動的表格，當為true時，翻頁欄被禁用，使用垂直滾動條載入數據，且在首次訪問伺服器端時將載入所有數據到客戶端。當此參數為數字時，表格只控制可見的幾行，所有數據都在這幾行中載入

false

否

scrollOffset

integer

設置垂直滾動條寬度

18

否

scrollrows

boolean

當為true時讓所選擇的行可見

false

是

selarrrow

array

只讀屬性，用來存放當前選擇的行

array

否

selrow

string

只讀屬性，最後選擇行的id

null

否

shrinkToFit

boolean

此屬性用來說明當初始化列寬度時候的計算類型，如果為ture，則按比例初始化列寬度。如果為false，則列寬度使用colModel指定的寬度

true

否

sortable

boolean

是否可排序

false

否

sortname

string

排序列的名稱，此參數會被傳到後臺

空字元串

是

sortorder

string

排序順序，升序或者降序（asc or desc）

asc

是

subGrid

boolean

是否使用suggrid

false

否

subGridModel

array

subgrid模型

array

否

subGridType

mixed

如果為空則使用表格的dataType

null

是

subGridUrl

string

載入subgrid數據的url，jqGrid會把每行的id值加到url中

空值

是

subGridWidth

integer

subgrid列的寬度

20

否

toolbar

array

表格的工具欄。數組中有兩個值，第一個為是否啟用，第二個指定工具欄位置（相對於body layer），如：[true,”both”] 。工具欄位置可選值：“top”,”bottom”, “both”. 如果工具欄在上面，則工具欄id為“t_”+表格id；如果在下麵則為 “tb_”+表格id；如果只有一個工具欄則為 “t_”+表格id

[false,'']

否

totaltime

integer

只讀屬性，計算載入數據的時間。目前支持xml跟json數據

0

否

treedatatype

mixed

數據類型，通常情況下與datatype相同，不會變

null

否

treeGrid

boolean

啟用或者禁用treegrid模式

false

否

treeGridModel

string

treeGrid所使用的方法

Nested

否

treeIcons

array

樹的圖標，預設值：{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

r oot元素的級別，

0

否

userData

array

從request中取得的一些用戶信息

array

否

userDataOnFooter

boolean

當為true時把userData放到底部，用法：如果userData的值與colModel的值相同，那麼此列就顯示正確的值，如果不等那麼此列就為空

false

是

viewrecords

boolean

是否要顯示總記錄數

false

否

viewsortcols

array

定義排序列的外觀跟行為。數據格式：[false,'vertical',true].第一個參數是說，是否都要顯示排序列的圖標，false就是只顯示 當前排序列的圖標；第二個參數是指圖標如何顯示，vertical：排序圖標垂直放置，horizontal：排序圖標水平放置；第三個參數指單擊功 能，true：單擊列可排序，false：單擊圖標排序。說明：如果第三個參數為false則第一個參數必須為ture否則不能排序

否

width

number

如果設置則按此設置為主，如果沒有設置則按colModel中定義的寬度計算

none

否

xmlReader

array

對xml數據結構的描述

否

屬性

數據類型

備註

預設值

align

string

left, center, right.

left

classes

string

設置列的css。多個class之間用空格分隔，如：'class1 class2' 。表格預設的css屬性是ui-ellipsis

empty string

datefmt

string

”/”, ”-”, and ”.”都是有效的日期分隔符。y,Y,yyyy 年YY, yy 月m,mm for monthsd,dd 日.

ISO Date (Y-m-d)

defval

string

查詢欄位的預設值

空

editable

boolean

單元格是否可編輯

false

editoptions

array

編輯的一系列選項。{name:’__department_id’,index:’__department_id’,width:200,editable:true,edittype:’select’,editoptions: {dataUrl:”${ctx}/admin/deplistforstu.action”}},這個是演示動態從伺服器端獲取數據。

empty

editrules

array

編輯的規則{name:’age’,index:’age’, width:90,editable:true,editrules: {edithidden:true,required:true,number:true,minValue:10,maxValue:100}},設定 年齡的最大值為100，最小值為10，而且為數字類型，並且為必輸欄位。

empty

edittype

string

可以編輯的類型。可選值：text, textarea, select, checkbox, password, button, image and file.

text

fixed

boolean

列寬度是否要固定不可變

false

formoptions

array

對於form進行編輯時的屬性設置

empty

formatoptions

array

對某些列進行格式化的設置

none

formatter

mixed

對列進行格式化時設置的函數名或者類型

{name:’sex’,index:’sex’, align:’center’,width:60,editable:true,edittype:’select’,editoptions: {value:’0:待定;1:男;2:女’},formatter:function(cellvalue, options, rowObject){
var temp = “<img src=’${ctx}/jquery-ui-1.7.2.custom/css/img/”
if(cellvalue==1){
temp = temp +”user-white.png”;
} else if(cellvalue==2){
temp = temp +”user-white-female.png”;
} else {
temp = temp + “user-silhouette.png”;
}
temp = temp + “‘ border=’0′ />”
return temp;
}},//返回性別的圖標。

none

hidedlg

boolean

是否顯示或者隱藏此列

false

hidden

boolean

在初始化表格時是否要隱藏此列

false

index

string

索引。其和後臺交互的參數為sidx

empty

jsonmap

string

定義了返回的json數據映射

none

key

boolean

當從伺服器端返回的數據中沒有id時，將此作為唯一rowid使用只有一個列可以做這項設置。如果設置多於一個，那麼只選取第一個，其他被忽略

false

label

string

如果colNames為空則用此值來作為列的顯示名稱，如果都沒有設置則使用name 值

none

name

string

表格列的名稱，所有關鍵字，保留字都不能作為名稱使用包括subgrid, cb and rn.

Required

resizable

boolean

是否可以被resizable

true

search

boolean

在搜索模式下，定義此列是否可以作為搜索列

true

searchoptions

array

設置搜索參數

empty

sortable

boolean

是否可排序

true

sorttype

string

用在當datatype為local時，定義搜索列的類型，可選值：int/integer - 對integer排序float/number/currency - 排序數字date - 排序日期text - 排序文本

text

stype

string

定義搜索元素的類型

text

surl

string

搜索數據時的url

empty

width

number

預設列的寬度，只能是象素值，不能是百分比

150

xmlmap

string

定義當前列跟返回的xml數據之間的映射關係

none

unformat

function

‘unformat’單元格值

null

total

總頁數

page

當前頁

records

查詢出的記錄數

rows

包含實際數據的數組

id

行id

cell

當前行的所有單元格

事件

參數

備註

afterInsertRow

rowidrowdatarowelem

當插入每行時觸發。rowid插入當前行的id；rowdata插入行的數據，格式為name: value，name為colModel中的名字

beforeRequest

none

向伺服器端發起請求之前觸發此事件但如果datatype是一個function時例外

beforeSelectRow

rowid, e

當用戶點擊當前行在未選擇此行時觸發。rowid：此行id；e：事件對象。返回值為ture或者false。如果返回true則選擇完成，如果返回false則不會選擇此行也不會觸發其他事件

gridComplete

none

當表格所有數據都載入完成而且其他的處理也都完成時觸發此事件，排序，翻頁同樣也會觸發此事件

loadComplete

xhr

當從伺服器返迴響應時執行，xhr：XMLHttpRequest 對象

loadError

xhr,status,error

如果請求伺服器失敗則調用此方法。xhr：XMLHttpRequest 對象；satus：錯誤類型，字元串類型；error：exception對象

onCellSelect

rowid,iCol,cellcontent,e

當點擊單元格時觸發。rowid：當前行id；iCol：當前單元格索引；cellContent：當前單元格內容；e：event對象

ondblClickRow

rowid,iRow,iCol,e

雙擊行時觸發。rowid：當前行id；iRow：當前行索引位置；iCol：當前單元格位置索引；e:event對象

onHeaderClick

gridstate

當點擊顯示/隱藏表格的那個按鈕時觸發；gridstate：表格狀態，可選值：visible or hidden

onPaging

pgButton

點擊翻頁按鈕填充數據之前觸發此事件，同樣當輸入頁碼跳轉頁面時也會觸發此事件

onRightClickRow

rowid,iRow,iCol,e

在行上右擊滑鼠時觸發此事件。rowid：當前行id；iRow：當前行位置索引；iCol：當前單元格位置索引；e：event對象

onSelectAll

aRowids,status

multiselect為ture，且點擊頭部的checkbox時才會觸發此事件。aRowids：所有選中行的id集合，為一個數組。status：boolean變數說明checkbox的選擇狀態，true選中false不選中。無論checkbox是否選擇，aRowids始終有 值

onSelectRow

rowid,status

當選擇行時觸發此事件。rowid：當前行id；status：選擇狀態，當multiselect 為true時此參數才可用

onSortCol

index,iCol,sortorder

當點擊排序列但是數據還未進行變化時觸發此事件。index：name在colModel中位置索引；iCol：當前單元格位置索引；sortorder：排序狀態：desc或者asc

resizeStart

event, index

當開始改變一個列寬度時觸發此事件。event：event對象；index：當前列在colModel中位置索引

resizeStop

newwidth, index

當列寬度改變之後觸發此事件。newwidth：列改變後的寬度；index：當前列在colModel中的位置索引

serializeGridData

postData

向伺服器發起請求時會把數據進行序列化，用戶自定義數據也可以被提交到伺服器端

方法名

參數

返回值

說明

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

coln

您的分享是我們最大的動力!

-Advertisement-