Ext.grid.GridPanel屬性祥解

1、ExtJS普通表格：Ext.grid.GridPanel屬性祥解表格相關(guān)組件總圖:表格ComponernpPanal詼昨甜乂俺化也“F鯉BcxComponent匚網(wǎng)咖啦_Jj-日 ool 召anColumriDateColumnColumnNumberColumnTemplateColumnColuimriModProperl/ColumnModeigrid Abstra ctSelactionModelCellSeEectionModelRowSeleclionModel. C打憂創(chuàng)訊聞nMo曲IGrid View GroupmgVigwPropertyRecord PropertySlor

2、e RowNumberer1、Ext.grid.GridPanel主要配置項(xiàng)：store：表格的數(shù)據(jù)集columns :表格列模式的配置數(shù)組，可自動(dòng)創(chuàng)建ColumnModel列模式autoExpandColumn :自動(dòng)充滿表格未用空間的列，參數(shù)為列id ,該id不能為0stripeRows :表格是否隔行換色，默認(rèn)為falsecm、colModel :表格的列模式，渲染表格時(shí)必須設(shè)置該配置項(xiàng)sm、selModel :表格的選擇模式，默認(rèn)為 Ext.grid.RowSelectionModelenableHdMenu :是否顯示表頭的上下文菜單，默認(rèn)為 trueenableColumnHide

3、 :是否允許通過標(biāo)題中的上下文菜單隱藏列，默認(rèn)為true（排序下的顯示列）loadMask :是否在加載數(shù)據(jù)時(shí)顯示遮罩效果，默認(rèn)為falseview :表格視圖，默認(rèn)為 Ext.grid.GridViewviewConfig :表格視圖的配置對(duì)象autoExpandMax :自動(dòng)擴(kuò)充列的最大寬度，默認(rèn)為1000autoExpandMin :自動(dòng)擴(kuò)充列的最小寬度，默認(rèn)為50columnLines :是否顯示列分割線，默認(rèn)為falsedisableSelection ：是否禁止行選擇，默認(rèn)為 false enableColumnMove ：是否允許拖放列，默認(rèn)為 true enableColumn

4、Resize ：是否允許改變列寬，默認(rèn)為truehideHeaders :是否隱藏表頭，默認(rèn)為 falsemaxHeight ：最大高度 minColumnWidth :最小列寬，默認(rèn)為 25 trackMouseOver :是否高亮顯示鼠標(biāo)所在的行，默認(rèn)為 true主要方法: getColumnModel() :取得列模式 getSelectionModel() :取得選擇模式 getStore() :取得數(shù)據(jù)集 getView() :取得視圖對(duì)象reconfigure( Ext.data.Store store, Ext.grid.ColumnModel colModel ) :使用一個(gè)新

5、的 數(shù)據(jù)集和列模式重新配置表格組件2、Ext.grid.Column 主要配置項(xiàng):id :列 idheader: 表頭文字dataIndex :設(shè)置列與數(shù)據(jù)集中數(shù)據(jù)記錄的對(duì)應(yīng)關(guān)系， 值為數(shù)據(jù)記錄中的字段名稱。 如果沒有設(shè)置該項(xiàng)則使用列索引與數(shù)據(jù)記錄中字段的索引進(jìn)行對(duì)應(yīng)width :列寬align :列數(shù)據(jù)的對(duì)齊方式hidden :是否隱藏列，默認(rèn)為falsefixed :是否固定列寬，默認(rèn)為falseme nuDisabled :是否禁用列的上下文菜單，默認(rèn)為falseresizable：是否允許改變列寬，默認(rèn)為 true sortable :是否允許排序，默認(rèn)為 truerenderer：設(shè)

6、置列的自定義單元格渲染函數(shù)傳入函數(shù)的參數(shù)有:value：數(shù)據(jù)的原始值metadata：元數(shù)據(jù)對(duì)象，用于設(shè)置單元格的樣式和屬性，該對(duì)象包含 的屬性有:css：應(yīng)用到單元格 TD元素上的樣式名稱attr:一個(gè) HTML 屬性定義字符串，例如 style="color:blue"' record :當(dāng)前數(shù)據(jù)記錄對(duì)象rowlndex :單元格的行索引colIndex :單元格的列索引booleancolumn 、store :數(shù)據(jù)集對(duì)象xtype :列渲染器類型，默認(rèn)為 gridcolumn ，其它可選值有 numbercolumn 、 datecolumn、 templa

7、tecolumn 等editable ：是否可編輯，默認(rèn)為 true editor ：編輯器groupName： emptyGroupText ： groupable：3、Ext.grid.ColumnModel 主要配置項(xiàng)： columns ：字段數(shù)組 defaultSortable ：是否進(jìn)行默認(rèn)排序，默認(rèn)為 false defaultWidth ：默認(rèn)寬度主要方法：findColumnIndex( String col ) ：根據(jù)給定的 dataIndex 查找列索引 getColumnById( String id ) ：取得指定 id 對(duì)應(yīng)的列 getColumnCount( Boo

8、lean visibleOnly ) ：取得列總數(shù) getColumnHeader( Number col ) ：取得列的表頭 getColumnId( Number index ) ：取得列 id getDataIndex( Number col ) ：取得列對(duì)應(yīng)的數(shù)據(jù)字段名 getIndexById( String id ) ：取得列索引 getTotalWidth( Boolean includeHidden ) isCellEditable( Number colIndex, Number rowIndex ) isFixed() isHidden( Number colIndex )

9、 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( Nu

10、mber col, Function fn )4、Ext.grid.AbstractSelectionModel主要方法：lock() ：鎖定選擇區(qū)域 unlock() ：解鎖選擇區(qū)域 isLocked() ：當(dāng)前選擇區(qū)域是否被鎖定5、Ext.grid.CellSelectionModel主要方法：clearSelections( Boolean preventNotify ) ：清除選擇區(qū)域getSelectedCell() ：取得當(dāng)前選擇的單元格，返回一數(shù)組，其格式：rowIndex,colIndexhasSelectio n():當(dāng)前是否有選擇區(qū)域 select( Number rowI

11、ndex, Number colIndex, Boolean preventViewNotify, Boolean preventFocus, Ext.data.Record r ) :選擇指定單元格6、Ext.grid.RowSelectionModel主要配置項(xiàng):singleSelect:是否單選模式，默認(rèn)為 false,即可以選擇多條數(shù)據(jù)主要方法:clearSelections( Boolean fast ) :清除所有選擇區(qū)域deselectRange( Number startRow, Number endRow ) :取消范圍內(nèi)的行選擇 deselectRow( Number ro

12、w, Boolean preventViewNotify ) :取消指定行的選擇狀 態(tài)each( Function fn, Object scope ) :遍歷所有選擇行， 并調(diào)用指定函數(shù)。 當(dāng)前被 選行將傳入該函數(shù)中g(shù)etCount() :得到選擇的總行數(shù)getSelected()：得到第一個(gè)被選記錄getSelections():得到所有被選記錄的數(shù)組hasNext():判斷當(dāng)前被選行之后是否還有記錄可以選擇hasPrevious():判斷當(dāng)前被選行之前是否還有記錄可以選擇hasSelectio n():是否已選擇了數(shù)據(jù)isIdSelected( String id ) :判斷指定 id

13、的記錄是否被選擇isSelected( Number/Record index ):判斷指定記錄或記錄索引的數(shù)據(jù)是否被選擇selectAll() :選擇所有行 selectFirstRow() :選擇第一行 selectLastRow( Boolean keepExisting ) :選擇最后行keepExisting :是否保持已有的選擇selectNext( Boolean keepExisting ) :選擇當(dāng)前選擇行的下一行 selectPrevious( Boolean keepExisting ) :選擇當(dāng)前選擇行的上一行 selectRange( Number startRow,

14、 Number endRow, Boolean keepExisting ) :選擇 范圍內(nèi)的所有行selectRecords( Array records, Boolean keepExisting ) :選擇一組指定記錄 selectRow( Number row, Boolean keepExisting, Boolean preventViewNotify ):選擇一行row:行索引selectRows( Array rows, Boolean keepExisting ) :選擇多行rows：行索引數(shù)組7、Ext.grid.CheckboxSelectionModel主要配置項(xiàng)：si

15、ngleSelect:是否單選模式，默認(rèn)為false,即可以選擇多條數(shù)據(jù)checkOnly :是否只能通過點(diǎn)擊checkbox列進(jìn)行選擇，默認(rèn)為 falsesortable :是否允許 checkbox列排序，默認(rèn)為 falsewidth : checkbox列的寬度，默認(rèn)為 208、Ext.grid.RowNumberer主要配置項(xiàng)：header：行號(hào)列表頭顯示的內(nèi)容width :列寬，默認(rèn)為239、Ext.grid.GridView主要配置項(xiàng)：enableRowBody :是否包含行體sortAscText :表格標(biāo)題菜單中升序的文字描述 sortDescText :表格標(biāo)題菜單中降序的文

16、字描述 colum nsText:表格標(biāo)題菜單中列對(duì)應(yīng)的文字描述 autoFill :是否自動(dòng)擴(kuò)展列以充滿整個(gè)表格，默認(rèn)為falseforceFit :是否強(qiáng)制調(diào)整表格列寬以適用表格的整體寬度，防止出現(xiàn)水平滾動(dòng)條，默認(rèn)為false主要方法：focusCell( Number row, Number col ):將焦點(diǎn)移到指定單元格focusRow( Number row ):將焦點(diǎn)移動(dòng)指定行g(shù)etCell( Number row, Number col ):取得指定單元格對(duì)應(yīng)的td元素getHeaderCell( Number index ):取得指定表頭對(duì)應(yīng)的td元素getRow( Number index ):取得指定行對(duì)應(yīng)的tr元素getRowClass( Record record, Number in dex, Object rowParams, Store store ):得 到附加到表格行上的樣式名recor