ExtJS使用详解：GridPanel与Column配置

"这篇文档是关于ExtJS框架的，特别是涉及到`Ext.grid.GridPanel`组件和`Ext.grid.Column`类的使用。文档中展示了如何配置日期文本框，并提供了`GridPanel`的一些关键属性和`Column`的主要配置项。" 在ExtJS中，`Ext.grid.GridPanel`是一个用于展示数据的强大组件，它可以结合`store`（数据存储）和`columns`（列定义）来创建动态的数据表格。以下是对`GridPanel`中部分属性的解释： 1. `store`：这是`GridPanel`的数据源，可以是`Ext.data.Store`对象，用于存储和管理表格中的数据。 2. `columns`：定义了表格的列结构，每个列可以通过`Ext.grid.Column`或其子类进行配置。 3. `autoExpandColumn`：如果设置，那么当网格宽度不足以显示所有列时，该列会被自动扩展以显示完整内容。默认值是`undefined`，意味着没有特定列被自动扩展。 4. `stripeRows`：如果为`true`，则交替行的背景色，提供视觉分隔，默认值是`false`。 5. `cm`（colModel）：这是旧版API中对列模型的引用，通常现在我们使用`columns`配置列。 6. `selModel`：选择模型，用于定义用户如何选择表格行，如`Ext.grid.RowSelectionModel`。 7. `enableHdMenu`：是否启用列头菜单，允许用户通过右键点击列头来调整列的显示，默认为`true`。 8. `enableColumnHide`：是否允许用户隐藏列，默认为`true`。 9. `loadMask`：在数据加载期间是否显示遮罩层，以表示正在处理，默认为`false`。 10. `view`：视图配置，通常是`Ext.grid.GridView`，负责渲染网格的外观。 11. `forceFit`：如果设置为`true`，所有列将适应网格的宽度，不允许有水平滚动条。 12. `autoExpandMax` 和 `autoExpandMin`：当`autoFit`为`true`时，列的最大和最小宽度限制。 13. `columnLines`：是否显示列之间的线条，默认为`false`。 14. `disableSelection`：是否禁用行选择，默认为`false`。 15. `enableColumnMove`：是否允许用户拖动列改变它们的顺序，默认为`true`。 16. `enableColumnResize`：是否允许用户调整列宽，默认为`true`。 17. `hideHeaders`：是否隐藏列头，默认为`false`。 18. `maxHeight` 和 `minColumnWidth`：分别设定网格的最大高度和列的最小宽度。 此外，`Ext.grid.Column`类是用于定义表格列的配置，包含了以下属性： 1. `id`：列的唯一标识符。 2. `header`：列头显示的文本。 3. `dataIndex`：与数据存储中的字段关联的键，用于从数据中获取值。 4. `width`：列的宽度。 5. `align`：列内容的对齐方式，如`left`、`right`或`center`。 6. `hidden`：是否隐藏此列，默认为`false`。 7. `fixed`：是否固定列的宽度，不允许用户调整，默认为`false`。 8. `menuDisabled`：是否禁用列头菜单中的选项，默认为`false`。 9. `resizable`：是否允许用户调整列宽，默认为`true`。 10. `sortable`：是否可排序，默认为`true`。 11. `renderer`：渲染函数，可以自定义单元格内容的显示方式。 12. `value` 和 `metadata`：对于`renderer`函数使用，`value`是单元格的原始数据，`metadata`包含额外的属性信息，如CSS样式。 13. `css`：可以直接应用于单元格的CSS类。 14. `attr`：一个HTML属性字符串，如`style="color:blue"`，可以添加到单元格的TD元素中。 15. `record` 和 `rowIndex`、`colIndex`：在渲染过程中，提供了当前单元格所对应的记录和位置信息。 16. `store`：列所在的`Store`对象。 17. `xtype`：列类型，通常设置为`gridcolumn`，也可以是其他子类，如`booleancolumn`。 总结来说，`ExtjsGrid`的`GridPanel`组件提供了丰富的配置选项，使得你可以灵活地构建各种复杂的数据展示界面，而`Column`类则允许你定制每一列的显示和行为。在实际应用中，开发者可以根据需求调整这些配置，以实现理想的表格功能。