ExtJS 实现选择列打印功能

"此资源主要展示了如何在ExtJS中实现打印功能，特别是针对表格中选中列的打印。示例代码包含了一个基本的HTML结构，引入了ExtJS的相关库，并通过JavaScript进行配置。" 在ExtJS中，实现打印功能通常涉及到以下几个关键知识点： 1. **Ext.grid.Panel**：在示例中，`Ext.grid.Panel` 是用于展示数据的组件，它允许用户选择、排序和操作数据。`Ext.grid.Panel` 支持多种配置，如列模型、数据源等。 2. **CheckboxSelectionModel**：`Ext.grid.CheckboxSelectionModel` 是一个选择模型，它在每行前面添加一个复选框，使用户能够通过勾选来选择表格中的行。 3. **ColumnModel**：`Ext.grid.ColumnModel` 定义了表格的列属性，包括列头、宽度、对齐方式和数据索引等。在示例中，列模型包含了行号列和rid、rolename两列的定义。 4. **数据源**：虽然在给出的代码中没有明确显示，但通常`Ext.grid.Panel`的数据源会通过`store`配置项来设定，可以是数组、JSON对象或者远程数据源。在这个例子中，数据源是`centerdata`数组，包含了rid和rolename两个字段。 5. **打印配置**：在实现打印功能时，可能需要对`Ext.grid.Panel`进行特殊配置，例如隐藏不需要打印的列（如行号列），或者调整列宽以适应打印格式。在`hhh.js`文件中，这部分逻辑可能被包含在自定义的函数中，用于处理打印前的面板准备。 6. **打印事件**：在用户触发打印操作时，可以通过监听`Ext.grid.Panel`的事件，如`beforeprint`或自定义事件来执行实际的打印任务。通常这会涉及到使用浏览器的打印API或者第三方打印插件。 7. **浏览器兼容性**：由于示例提到了需要在IE浏览器中使用特定设置，这表明打印功能可能依赖于特定的浏览器特性，比如ActiveX。对于现代Web应用，通常需要考虑跨浏览器兼容性，确保在Firefox、Chrome、Safari等其他主流浏览器中也能正常工作。 8. **HTML和CSS**：为了确保打印效果，可能需要在CSS中定义打印样式，如`@media print`规则，以控制打印时的布局和样式。 9. **JavaScript库**：引入的`ext/adapter/ext/ext-base.js`和`ext/ext-all.js`是ExtJS的核心库，提供了组件、数据绑定、事件处理等功能。而`hhh.js`是自定义的JavaScript文件，可能包含了实现打印功能的具体代码。 这段代码是在一个基于ExtJS的环境中创建一个表格，并设置了打印功能，尤其是针对选中列的打印。为了完整实现这个功能，开发者需要处理数据加载、表格配置、选择模型、打印事件以及可能的浏览器兼容性问题。