Jquery datagrid의 속성, 이벤트

7857 단어 datagrid
Options
DataGrid Properties
Override default with $.fn.datagrid.defaults.
NameTypeDescriptionDefault
title
string
The datagrid panel title text.
null
iconCls
string
A CSS class that will provide a background image to be used as the header icon.
null
border
boolean
True to show datagrid panel border.
true
width
number
The width of datagrid width.
auto
height
number
The height of datagrid height.
auto
columns
array
The datagrid columns config object, see column properties for more details.
null
frozenColumns
array
Same as the columns property, but the these columns will be frozen on left.
null
striped
boolean
True to stripe the rows.
false
method
string
The method type to request remote data.
post
nowrap
boolean
True to display data in one line.
true
idField
string
Indicate which field is an identity field.
null
url
string
A URL to request data from remote site.
null
loadMsg
string
When loading data from remote site, show a prompt message.
Processing, please wait …
pagination
boolean
True to show a pagination toolbar on datagrid bottom.
false
rownumbers
boolean
True to show a row number column.
false
singleSelect
boolean
True to allow selecting only one row.
false
fit
boolean
True to set size to fit it's parent container.
false
pageNumber
number
When set pagination property, initialize the page number.
1
pageSize
number
When set pagination property, initialize the page size.
10
pageList
array
When set pagination property, initialize the page size selecting list.
[10,20,30,40,50]
queryParams
object
When request remote data, sending additional parameters also.
{}
sortName
string
Defines which column can be sorted.
null
sortOrder
string
Defines the column sort order, can only be 'asc' or 'desc'.
asc
Column Properties
The DataGrid Columns is an array object, which element is an array too.The element of element array is a config object, which defines every column field.code example:
columns:[[
    {field:'itemid',title:'Item ID',rowspan:2,width:80,sortable:true},
    {field:'productid',title:'Product ID',rowspan:2,width:80,sortable:true},
    {title:'Item Details',colspan:4}
],[
    {field:'listprice',title:'List Price',width:80,align:'right',sortable:true},
    {field:'unitcost',title:'Unit Cost',width:80,align:'right',sortable:true},
    {field:'attr1',title:'Attribute',width:100},
    {field:'status',title:'Status',width:60}
]]

NameTypeDescriptionDefault
title
string
The column title text.
undefined
field
string
The column field name.
undefined
width
number
The width of column.
undefined
rowspan
number
Indicate how many rows a cell should take up.
undefined
colspan
number
Indicate how many columns a cell should take up.
undefined
align
string
Indicate how to align the column data. 'left','right','center' can be used.
undefined
sortable
boolean
True to allow the column can be sorted.
undefined
checkbox
boolean
True to show a checkbox.
undefined
Events
NameParametersDescription
onLoadSuccess
none
Fires when remote data is loaded successfully.
onLoadError
none
Fires when some error occur to load remote data.
onClickRow
rowIndex, rowData
Fires when user click a row, the parameters contains:rowIndex: the clicked row index, start with 0rowData: the record corresponding to the clicked row
onDblClickRow
rowIndex, rowData
Fires when user dblclick a row, the parameters contains:rowIndex: the clicked row index, start with 0rowData: the record corresponding to the clicked row
onSortColumn
sort, order
Fires when user sort a column, the parameters contains:sort: the sort column field nameorder: the sort column order
onSelect
rowIndex, rowData
Fires when user select a row, the parameters contains:rowIndex: the selected row index, start with 0rowData: the record corresponding to the selected row
onUnselect
rowIndex, rowData
Fires when user unselect a row, the parameters contains:rowIndex: the unselected row index, start with 0rowData: the record corresponding to the unselected row
Methods
Name
Parameter
Description
options
none
Return the options object.
resize
none
Do resize and do layout.
reload
none
Reload the rows.
fixColumnSize
none
fix columns size.
loadData
param
Load local data, the old rows will be removed.
getSelected
none
Return the first selected row record or null.
getSelections
none
Return all selected rows, when no record selected, am empty array will return.
clearSelections
none
Clear all selections.
selectRow
index
Select a row, the row index start with 0.
selectRecord
idValue
Select a row by passing id value parameter.
unselectRow
index
Unselect a row.

좋은 웹페이지 즐겨찾기