<ext:component layout="form" columnWidth=".25" defaultType="textfield" labelWidth="35">
<ext:combbox name="dimLevel" fieldLabel="范围:" defaultValue="PRODUCT_STORE" width="100"
dataArray="<%=dimLevelStr %>">
</ext:combbox>
</ext:component>
<ext:panel id="productSalesInfoPanel" name="productSalesInfoPanel" region="center" layout="fit" bodyStyle="padding:10px;">
<ext:fieldSet id="productSalesInfoSet" name="productSalesInfoSet" title="报表信息" layout="fit">
<ext:grid action="/ccbs/report/ccbsShowReport.do?method=queryProductSalesList"
name="couponDataGrid" id="couponDataGrid" height="300" withCheckBox="true" paging="true" autoScroll="true">
<ext:column width="100" header="门店" dataIndex="SHOW_NAME" ></ext:column>
</ext:grid>
</ext:fieldSet>
</ext:panel>
//grid加载数据
function onready(){
couponDataGrid.getStore().load();
dimLevel.on("select",dimLevelClick);
}
//根据combbox中的值改变grid中的列标题
function dimLevelClick(){
//dimLevel.value;//value ext 获取combbox的值
//dimLevel.getValue();//getValue() ext 获取combbox的值
//dimLevel.getRawValue();//getRawValue() ext 获取combbox中的文本
var dimLevelText=dimLevel.getRawValue();
couponDataGrid.getColumnModel().setColumnHeader(1,dimLevelText);//修改grid中指定下标的文本值
}
分享到:
相关推荐
在JavaScript代码中,我们需要解析这个XML文件,提取出每个`column`元素的`header`、`width`和`dataIndex`属性,然后用它们来动态生成Grid的列配置。可以使用`Ext.dom.Element`的`select`方法或者`Ext.XmlReader`来...
columns: [{header: 'Column 1'}, {header: 'Column 2'}], // 列配置 ... }); // 添加到ComboBox的父容器或指定位置 comboBox.getParent().add(grid); grid.show(); } } }); ``` 为了实现“点击其他地方...
ExtJS GRID是一款强大的JavaScript数据网格组件,用于展示和操作大量结构化数据。在ExtJS 4.0版本中,Grid提供了单元格合并的功能,这在处理复杂数据展示时非常有用,比如汇总信息或者创建表头合并。下面我们将深入...
3. **列模型(Column Model)**:定义Grid的列布局,`Ext.grid.ColumnModel`(在新版本中是`Ext.grid.header.Container`和`Ext.grid.column.Column`),设置每列的标题、数据绑定、宽度等属性。 4. **Grid Panel**...
- 对于Grid的列,我们可以使用`Ext.grid.column.Column`的`tooltip`配置项,或者使用`renderer`函数来动态生成Tooltip内容。 2. **配置列的Tooltip**: - 在定义Grid的列模型时,可以直接在列配置对象中设置`...
ColumnModel是GridPanel的列定义,它包含了每列的属性,如标题(header)、数据索引(dataIndex)和宽度(width)。`addColumn`函数通过遍历后端返回的数据,为每个字段生成对应的ColumnModel配置。 接下来,我们...
### ExtJs Grid 使用详解 #### 一、ExtJs Grid 概览 ExtJs是一个功能强大的JavaScript框架,用于构建复杂的Web应用程序。其中,Grid是ExtJs中最常用的数据展示组件之一,它能够以表格形式显示数据,并提供了丰富的...
ExtJS Grid是一款强大的数据展示组件,常用于构建复杂的Web应用程序中的数据网格。多表头插件是ExtJS Grid的一个重要特性,它允许我们创建具有多层次、复杂结构的表头,以便更好地组织和呈现数据。在ExtJS Grid中,...
根据提供的文件信息以及标题与描述,本文将详细探讨Extjs Grid的操作大全,特别是关于如何获取Grid中的各种值以及如何添加各种点击事件。 ### Extjs Grid 操作大全 #### 一、Extjs Grid简介 Extjs 是一个用...
这个例子展示了如何结合ExtJs的Grid、XML以及Struts2 Action来动态加载Grid的Title和列信息。这种方式不仅使得代码更加模块化,也便于在后期维护和扩展,比如实现多语言支持时只需更改XML文件即可。在实际项目中,还...
要实现EXTjs grid的双层表头,我们需要使用EXTjs的`column`配置和`headerContainer`组件。具体步骤如下: 1. 创建grid面板: 首先,创建一个EXTjs的grid面板,设置其基本属性,如store(数据源)和columns(列配置...
2. **Column Model**:EXTJS Grid的列模型定义了列的属性,包括字段名、宽度、对齐方式、可编辑性等。如果列显示异常,可能是Column Model的配置有误。检查每个列的配置,确保字段名正确对应数据源中的字段。 3. **...
本文将详细介绍 Extjs 中 Grid 组件的基本用法,包括如何创建 Grid、如何配置列模型 (Column Model)、如何处理不同格式的数据源以及如何在 Grid 中添加 CheckBox。 #### 二、Grid 组件基础 ##### 2.1 构建基本的 ...
在ExtJS 4.0中,列模型通过`Ext.grid.header.Container`和`Ext.grid.column.Column`进行配置,每个列都是一个`Column`实例。列模型可以包含列的字段名、标题、宽度、是否可排序等信息。 5. **Store(数据存储)** ...
在本文中,我们将深入探讨如何在ExtJS 4框架中实现Grid组件的修改和删除功能,同时结合Struts2和Hibernate技术,构建一个完整的CRUD(创建、读取、更新、删除)应用。ExtJS 4是一个强大的JavaScript UI库,提供了...
最后,创建Grid Panel并指定Store和Column配置。例如: ```javascript Ext.create('Ext.grid.Panel', { title: '用户列表', store: store, columns: [ {header: 'ID', dataIndex: 'id', width: 50}, {header...
1. **行颜色修改**:通过 `getRowClass` 方法可以根据行数据的属性来动态设置行的CSS类名,进而改变行的颜色。 2. **列颜色修改**:通过 `ColumnModel` 的 `renderer` 属性指定自定义渲染器,可以在单元格级别上设置...
Columns包含了数据列的相关信息,如列头(Header),在EXTJS中,这些信息由Column Model管理。Fields则指的是数据列中实际的数值,它们在reader中定义,负责加载数据。EXTJS支持多种数据格式,如XML、JSON等,通过...
双表头在ExtJS中可以通过`Ext.grid.header.Container`和`Ext.grid.column.Column`组件的组合来实现。首先,创建一个`headerContainer`,然后在这个容器中添加两个或多个`column`,这些`column`可以设置不同的标题和...
ExtJS 是一个强大的JavaScript框架,主要用于构建富客户端的Web应用程序,而Grid是ExtJS中的一个核心组件,用于展示数据表格。在本篇文章中,我们将深入探讨如何使用ExtJS与Gride进行交互,创建功能丰富的数据网格。...