Detailed introduction to the main configuration parameters of Extjs4 GridPanel_extjs

1. Ext.grid.GridPanel
Main configuration items:
store: table data set
columns: configuration array of table column mode, which can automatically create ColumnModel column mode
autoExpandColumn: a column that automatically fills the unused space of the table. The parameter is the column id, which cannot be 0
stripeRows: whether the table changes color every other row. The default is false
cm, colModel: the column mode of the table, when rendering the table This configuration item must be set
sm, selModel: the selection mode of the table, the default is Ext.grid.RowSelectionModel
enableHdMenu: whether to display the context menu of the table header, the default is true
enableColumnHide: whether to allow passing in the title The context menu hides columns, the default is true
loadMask: whether to display the mask effect when loading data, the default is false
view: table view, the default is Ext.grid.GridView
viewConfig: table view Configuration object
autoExpandMax: The maximum width of automatically expanded columns, the default is 1000
autoExpandMin: The minimum width of automatically expanded columns, the default is 50
columnLines: Whether to display column dividing lines, the default is false
disableSelection : Whether to disable row selection, the default is false
enableColumnMove: Whether to allow dragging and dropping columns, the default is true
enableColumnResize: Whether to allow column width changes, the default is true
hideHeaders: Whether to hide table headers, the default is false
maxHeight: maximum height
minColumnWidth: minimum column width, default is 25
trackMouseOver: whether to highlight the row where the mouse is located, the default is true
Main methods:
getColumnModel(): get Column mode
getSelectionModel(): Get the selection mode
getStore(): Get the data set
getView(): Get the view object
reconfigure( Ext.data.Store store, Ext.grid.ColumnModel colModel ): Reconfigure the table component using a new data set and column mode

2, Ext.grid.Column
Main configuration items:
id: column id
Header: Header text
dataIndex: Set the correspondence between the column and the data record in the data set, the value is the field name in the data record.If this item is not set, the column index will be used to correspond to the index of the field in the data record
width: column width
align: alignment of column data
hidden: whether to hide the column, the default is false
fixed: whether to fix the column width, the default is false
menuDisabled: whether to disable the column context menu, the default is false
resizable: whether to allow changing the column width, the default is true
sortable: whether to allow sorting, the default is false true
renderer: Set the custom cell rendering function of the column
The parameters passed into the function are:
value: The original value of the data
metadata: Metadata object, used to set the style of the cell and attributes. The attributes contained in this object are:
css: the style name applied to the cell TD element
attr: an HTML attribute definition string, such as 'style="color:blue"'
record: current data record object
rowIndex: row index of the cell
colIndex: column index of the cell
store: data set object
xtype: column renderer type, default is gridcolumn, others can be The options include booleancolumn, numbercolumn, datecolumn, templatecolumn, etc.
editable: whether it is editable, the default is true
editor: editor
groupName:
emptyGroupText:
groupable:

3. Ext.grid.ColumnModel
Main configuration items:
columns: field array
defaultSortable: whether to perform default sorting, the default is false
defaultWidth: default width
Main methods:
findColumnIndex(String col): Find the column index based on the given dataIndex
getColumnById(String id): Get the column corresponding to the specified id
getColumnCount(Boolean visibleOnly): Get the total number of columns
getColumnHeader(Number col): Get the header of the column
getColumnId(Number index): Get the column id
getDataIndex(Number col): Get the data field name corresponding to the column
getIndexById(String id): Get Column index
getTotalWidth( Boolean includeHidden )
isCellEditable( Number colIndex, Number rowIndex )
isFixed()
isHidden( Number colIndex )
setColumnHeader( Number col, String header )
setColumnWidth ( Number col, Number width, Boolean suppressEvent )
setDataIndex( Number col, String dataIndex )
setEditable( Number col, Boolean editable )
setEditor( Number col, Object editor )
setHidden( Number colIndex , Boolean hidden )
setRenderer( Number col, Function fn )

4. Ext.grid.AbstractSelectionModel
Main method:
lock(): Lock the selection area
unlock(): Unlock the selection area
isLocked(): Whether the current selection area is locked

5. Ext.grid.CellSelectionModel
Main method:
clearSelections(Boolean preventNotify): Clear the selection area
getSelectedCell(): Get the currently selected cell and return an array, its format: [rowIndex, colIndex]
hasSelection(): Whether there is currently a selection area
select(Number rowIndex, Number colIndex, [Boolean preventViewNotify], [Boolean preventFocus], [Ext.data.Record r] ): Select the specified cell

6, Ext.grid.RowSelectionModel
Main configuration items:
singleSelect: Whether to select single selection mode, the default is false, that is, multiple pieces of data can be selected
Main methods:
clearSelections([Boolean fast]): Clear all selection areas
deselectRange(Number startRow, Number endRow): Cancel row selection within the range
deselectRow(Number row, [Boolean preventViewNotify]): Cancel the selection state of the specified row
each( Function fn, [Object scope] ): Traverse all selected rows and call the specified function.The currently selected row will be passed into this function
getCount(): Get the total number of selected rows
getSelected(): Get the first selected record
getSelections(): Get the array of all selected records
hasNext(): Determine whether there are records after the currently selected row that can be selected
hasPrevious(): Determine whether there are records before the currently selected row that can be selected
hasSelection(): Whether the data has been selected
isIdSelected(String id): Determine whether the record with the specified id is selected
isSelected(Number/Record index): Determine whether the data of the specified record or record index is selected
selectAll(): Select all rows
selectFirstRow(): Select the first row
selectLastRow([Boolean keepExisting]): Select the last row
keepExisting: Whether to keep the existing selection
selectNext([Boolean keepExisting]): Select the currently selected row Next row
selectPrevious([Boolean keepExisting]): Select the previous row of the currently selected row
selectRange(Number startRow, Number endRow, [Boolean keepExisting]): Select all rows in the range
selectRecords(Array records , [Boolean keepExisting] ): Select a set of specified records
selectRow( Number row, [Boolean keepExisting], [Boolean preventViewNotify] ): Select a row
row: Row index
selectRows( Array rows, [Boolean keepExisting] ): Select multiple rows
rows: Row index array

7. Ext.grid.CheckboxSelectionModel
Main configuration items:
singleSelect: Whether to select single selection mode , the default is false, that is, multiple pieces of data can be selected
checkOnly: whether to select only by clicking on the checkbox column, the default is false
sortable: whether to allow sorting of the checkbox column, the default is false
width: checkbox column The width, the default is 20

8, Ext.grid.RowNumberer
Main configuration items:
header: content displayed in the row number list header
width: column Width, default is 23

9. Ext.grid.GridView
Main configuration items:
enableRowBody: whether to include row body
sortAscText: ascending order in table title menu Text description
sortDescText: Text description of descending order in the table title menu
columnsText: Text description corresponding to the column in the table title menu
autoFill: Whether to automatically expand the column to fill the entire table, the default is false
forceFit: Whether to forcefully adjust the table column width to fit the overall width of the table to prevent horizontal scroll bars from appearing. The default is false
Main method:
focusCell(Number row, Number col): Move focus to the specified cell
focusRow(Number row): Move the focus to the specified row
getCell(Number row, Number col): Get the td element corresponding to the specified cell
getHeaderCell(Number index): Get the td element corresponding to the specified header
getRow(Number index): Get the tr element corresponding to the specified row
getRowClass(Record record, Number index, Object rowParams, Store store): Get the style name attached to the table row
record: current row The data record object
index: the index of the current row
rowParams: the configuration object passed into the row template when rendering, through which the style can be customized for the row body. This object only takes effect when enableRowBody is true. Possible attributes are as follows:
body: HTML code fragment rendered into the line body
bodyStyle: String applied to the style attribute of the line body tr element
cols: Value applied to the colspan attribute of the line body td element , the default is the total number of columns
store: table data set
refresh( [Boolean headersToo] ): refresh the table component
scrollToTop(): scroll the table to the top

Actual combat 1:
Let the gridpanel's scroll bar automatically scroll to the last record (dynamically insert data):
grid.getView().focusRow(vehiclePassInfoGrid.getStore().getCount()-1);

2: Clear the status of selected rows in the gridpanel:
grid.getSelectionModel().clearSelections();