Ext.grid Common Properties and methods

Source: Internet
Author: User
1 , Ext.grid.GridPanel
Main Configuration items:
Store: Data sets for tables
Columns: A configuration array of table column patterns that automatically creates Columnmodel column patterns
Autoexpandcolumn: A column that automatically fills the unused space of a table, with a column ID of the parameter, which cannot be 0
Striperows: Whether the table is interleaved and the default is False
CM, Colmodel: The column mode of the table, which must be set when rendering the table
SM, Selmodel: Table selection mode, default to Ext.grid.RowSelectionModel
Enablehdmenu: Display the context menu for the header, default to True
Enablecolumnhide: Allow hidden columns through context menu in header, default to True
Loadmask: Whether the mask effect is displayed when data is loaded, false by default
View: Table view, default to Ext.grid.GridView
Viewconfig: Configuration object for Table view
Autoexpandmax: Automatically expands the maximum width of the column, defaults to 1000
Autoexpandmin: The minimum width of the automatic expansion column, the default is 50
Columnlines: Display column split line, default to False
Disableselection: Do not prevent row selection, default to False
Enablecolumnmove: Allow drag-and-drop columns, default to True
Enablecolumnresize: Allow changes to column widths, default to True
Hideheaders: Hide header, default to False
MaxHeight: Maximum Height
Mincolumnwidth: Minimum column width, defaults to 25
Trackmouseover: Highlight the line on which the mouse is located, default to True
Main methods:
Getcolumnmodel (): Get column mode
Getselectionmodel (): Get selection mode
GetStore (): Getting data sets
GetView (): Getting the View object
Reconfigure (Ext.data.Store Store, Ext.grid.ColumnModel Colmodel): Reconfiguring a table component using a new dataset and column mode
2, Ext.grid.Column
Main Configuration items:
ID: Column ID
Header: Table Header text
Dataindex: Sets the corresponding relationship between the column and the data record in the dataset, and the value is the field name in the data record. If the item is not set, the column index is used to correspond to the index of the field in the data record
Width: Column width
Align: alignment of column data
Hidden: Hide columns, default to False
Fixed: Does the column width, default to False
Menudisabled: The context menu for the column is disabled, and the default is False
Resizable: Allow changes to column widths, default to True
Sortable: Allow sorting, default to True
Renderer: Set custom cell rendering functions for columns
Parameters for incoming functions are:
Value: The original value of the data
Metadata: A metadata object that is used to set the style and properties of a cell that contains the following properties:
CSS: Style names applied to cell TD elements
attr: An HTML attribute definition string, such as ' style= ' Color:blue '
Record: Current Data logging Object
RowIndex: Row index of cell
Colindex: Column index of cell
Store: DataSet object
Xtype: Column renderer type, default is GridColumn, other optional values are Booleancolumn, Numbercolumn, Datecolumn, TemplateColumn, etc.
Editable: Editable, default to True
Editor: Editor
GroupName:
Emptygrouptext:
Groupable:
3, Ext.grid.ColumnModel
Main Configuration items:
Columns: Field array
Defaultsortable: Default sort, default to False
DefaultWidth: Default width
Main methods:
Findcolumnindex (String col): Finds a column index based on a given dataindex
Getcolumnbyid (String ID): Gets the column corresponding to the specified ID
getColumnCount (Boolean visibleonly): Get the total number of columns
Getcolumnheader (number col): Gets the header of the column
Getcolumnid (number Index): Get column ID
Getdataindex (number col): Get the data field name corresponding to the column
Getindexbyid (String ID): Get the 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 methods:
Lock (): Lock Select Area
Unlock (): Unlock selection area
IsLocked (): Whether the currently selected area is locked
5, Ext.grid.CellSelectionModel
Main methods:
Clearselections (Boolean preventnotify): Clear Select Area
Getselectedcell (): Gets the currently selected cell, returns an array, in the format: [Rowindex,colindex]
Hasselection (): Currently there is a selection area
Select (number rowIndex, number Colindex, [Boolean preventviewnotify], [Booleanpreventfocus], [Ext.data.Record R]) : Select the specified cell
6, Ext.grid.RowSelectionModel
Main Configuration items:
Singleselect: Whether the radio mode, default is False, that is, you can select more than one data
Main methods:
Clearselections ([Boolean fast]): Clear all selection areas
Deselectrange (number StartRow, number Endrow): Canceling row selection in range
Deselectrow (number row, [Boolean preventviewnotify]): Cancels the selection state of the specified row
Each (function fn, [Object scope]): Iterates through all the selection rows and invokes the specified function. The currently selected row is passed into the function
GetCount (): Total number of rows selected
GetSelected (): Get the first selected record
Getselections (): Gets an array of all selected records
Hasnext (): Determines whether there are records to choose from after the currently selected line
Hasprevious (): Determine if there are records to choose from before the currently selected line
Hasselection (): Whether the data has been selected
isidselected (String ID): Determines whether the record of the specified ID is selected
IsSelected (Number/record index): Determines whether the specified record or record index data is selected
SelectAll (): Select All Rows
Selectfirstrow (): Select First row
Selectlastrow ([Boolean keepexisting]): Select last line
Keepexisting: Keep the choices you have
Selectnext ([Boolean keepexisting]): Select the next line of the currently selected row
Selectprevious ([Boolean keepexisting]): Select the previous line of the currently selected row
Selectrange (number StartRow, number Endrow, [Boolean keepexisting]): Select All rows in range
Selectrecords (Array Records, [Boolean keepexisting]): Select a set of specified records
SelectRow (number row, [Boolean keepexisting], [Boolean preventviewnotify]): Select a row
Row: Line Index
Selectrows (Array rows, [Boolean keepexisting]): Select multiple rows
Rows: Row index array
7, Ext.grid.CheckboxSelectionModel
Main Configuration items:
Singleselect: Whether the radio mode, default is False, that is, you can select more than one data
Checkonly: Can only be selected by clicking the CheckBox column, which defaults to False
Sortable: Allow checkbox column sort, default to False
The width of the Width:checkbox column, which defaults to 20
8, Ext.grid.RowNumberer
Main Configuration items:
Header: Line number list header display content
Width: column width, defaults to 23
9, Ext.grid.GridView
Main Configuration items:
Enablerowbody: Whether to include row body
Sortasctext: The ascending text description in the table header menu
Sortdesctext: Descending text description in table header menu
Columnstext: The text description of the column in the table header menu
AutoFill: Automatically extend columns to fill the entire table, default to False
Forcefit: Force table column widths to fit the overall width of the table, prevent horizontal scroll bars from appearing, default to False
Main methods:
Focuscell (number row, number col): Move focus to specified cell
Focusrow (number Row): Move focus to the specified line
Getcell (number row, number col): Gets the TD element corresponding to the specified cell
Getheadercell (number Index): Get the TD element corresponding to the specified table header
GetRow (number Index): Gets 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: Data logging object for current row
Index: Indexes of current row
Rowparams: A configuration object that is passed into a row template when rendered, by which you can customize the style for the row body, which takes effect only when Enablerowbody is true, and the possible properties are as follows:
Body: HTML snippet rendered to line
Bodystyle: String applied to the row body TR element Style property
Cols: The value of the colspan attribute applied to the line-body TD element, default to the total number of columns
Store: Tabular Data set
Refresh ([Boolean Headerstoo]): Refreshes the table component
Scrolltotop (): Scrolling table to top
Actual combat:
1. Allow the Gridpanel scroll bar to automatically scroll to the last record (insert data dynamically):
Grid.getview (). Focusrow (Vehiclepassinfogrid.getstore (). GetCount ()-1);
2. Clear Gridpanel in the selected state:
Grid.getselectionmodel (). Clearselections ();
3. Get row and column information
var rowIndex = Grid.getstore (). GetCount ();//grid number of rows
var colindex = Grid.getcolumnmodel (). getColumnCount (); Number of columns in grid
alert (Colindex);
for (var i = 0; i< rowIndex; i++) {
Record = Grid.getstore (). getAt (i);
var colname = Grid.getcolumnmodel (). Getdataindex (i); Get Column Name
var celldata = Grid.getstore (). GetAt (Cell[0]). Get (colname); Get Data
Ext.MessageBox.alert ("Test", colname);
for (var j = 0; j < Colindex; colindex++) {
Ext.MessageBox.alert ("Test", Grid.getcolumnmodel (). Getdataindex (j));
}
}

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.