GridPanelTest.html
<html>
<head>
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
<script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../../ext-all.js"></script>
<script language="javascript" type="text/javascript">
var myData=[
[0,"MysTitle_0","Dangzhao_0"],
[1,"MysTitle_1","Dangzhao_1"],
[2,"MysTitle_2","Dangzhao_2"],
[3,"MysTitle_3","Dangzhao_3"],
[4,"MysTitle_4","Dangzhao_4"]
];
var store = new Ext.data.SimpleStore({
autoLoad : true,
baseParams : {
"Action" : "Select",
"Id" : "0"
},
data : myData,
fields : [
{ name : "id" , mapping : 0},
{ name : "name" , mapping : 2},
{ name : "title" , mapping : 1}
],
id : 0,
listeners : {
beforeload : function(){alert("beforedload")},
load : function(){alert("load")},
loadexception : function(){alert("loadexception")}
//And all SimpleStore's Event
},
pruneModifiedRecords : false,
remoteSort : false//because use client data so this property must false,
});
var grid = new Ext.grid.GridPanel({
store : store,
title:'Mys GridPanel',
height:360,
width:600,
collapsible : true,
animCollapse : true,
allowDomMove : true,
columns : [
{id : "id" ,header : "id" , width: 160 ,sortable: true, dataIndex : 'id'},
{header : "name" , width: 160 ,sortable: true, dataIndex : 'name'},
{header : "title" , width: 160 ,sortable: true, dataIndex : 'title'}
]
});
Ext.onReady(init);
function init(){
grid.render("gridDiv");
}
</script>
</head>
<body>
<div style="position:absolute;top:40px;left:40px;width:600px;height=360px" id="gridDiv">
</div>
</body>
</html>
- 描述: Show 一下Ext的魅力
- 大小: 21 KB
分享到：
相关推荐
这个"EXTJSEXT实例GridPanel"可能是为了演示基本的GridPanel使用方法，包括数据绑定、列定义以及如何在页面上渲染GridPanel。通过学习和实践这个例子，开发者可以快速掌握EXTJS中数据展示的核心技术。配合EXT提供的...
在`GridPanel`中单元格赋值，例如在弹出窗体关闭后更新选定行的数据，可以使用`Ext.getCmp`获取`GridPanel`对象，然后通过`getStore().getAt(rowIndex)`获取特定行的记录，最后利用`set`方法设置字段值，如`record....
gridpanel 的使用 GridPanel 是 ExtJS 框架中的一种基本组件，用于显示和操作数据集合。它提供了丰富的配置项和方法，方便开发者快速构建数据-grid 视图。 主要配置项 GridPanel 的主要配置项包括： * `store`: ...
"GridPanel中的单元格不能选中复制的解决方法" Ext.grid.GridPanel 是一个功能强大且广泛使用的Grid控件，但是它存在一个很大的缺陷：单元格的内容不能选中，没法选中就没法复制，这给用户带来了很多不便。这个...
然后在需要重新加载数据时，而不是重新创建整个GridPanel，我们只需要调用`myGrid.reconfigure()`或`myGrid.store.loadData()`方法，这样就能更新GridPanel的数据而不会丢失原有的配置和状态。 以下是一个简单的...
- 最后，将自定义的View类赋值给GridPanel的`viewConfig.view`属性，使GridPanel使用这个自定义的View。 总结来说，EXTJS的GridPanel添加“合计”行涉及到View的自定义、数据计算、模板创建、DOM操作以及样式调整...
以上就是关于ExtJs GridPanel双击事件获取双击的行及选中复选框状态的实现方法。通过这些知识，你可以轻松地在GridPanel中添加用户交互功能，提升应用程序的用户体验。请确保在实际项目中根据需求调整代码，以满足...
在使用GridPanel组件进行数据展示时，为了提高可读性和用户体验，我们经常需要对表格中的某些行或单元格进行颜色上的区分。本文将详细介绍如何通过不同的方法来实现这一功能，包括在加载数据时改变列的颜色、加载...
此插件可能包含了添加、删除和管理多表头的方法，以及与EXTJS Gridpanel交互的逻辑。通过调用这个插件，开发者可以在Gridpanel上轻松地启用和操作多表头。 在EXTJS中，使用这个插件可能需要以下步骤： - 首先，需要...
在这个主题中，我们将深入探讨 GridPanel 的关键特性和使用方法。 1. **GridPanel 基本结构**： GridPanel 包含了行和列，用于显示数据集。每个单元格可以绑定到数据模型的一个字段。通过配置列定义（columns），...
下面将详细阐述`GridPanel`中的关键属性和方法。 1. **store**： GridPanel 的数据源是通过 `store` 配置项指定的，它可以是 `Ext.data.Store` 对象，用于存储和管理数据记录。`store` 负责加载、缓存和处理数据，...
#### 三、Ext.grid.GridPanel主要方法 1. **getColumnModel()** - 说明：获取当前表格的列模型。 2. **getSelectionModel()** - 说明：获取当前表格的选择模式。 3. **getStore()** - 说明：获取当前表格的数据...
3. **日期列**: 可以通过设置`renderer`函数来格式化日期，例如使用`Ext.util.Format.dateRenderer`方法。 4. **数字列**: 对于`number`类型的数据，可以设定精度或者货币格式。 5. **操作列**: 可以创建包含按钮或...
后来公司让改变一个Gridpanel的展现方式，要求实现滚屏的效果。于是我就开始找API相关的功能了。找了很久，也没有找到框架的相应控制方法，然后在网上找了很久，也没有找到有人给去示例，无奈就只能自己写JS来控制...
将页面的GridPanel中的...使用方法: 1)把三个JS文件引入到页面中 2)调用例句: var data2Excel = new Ext.icss.Data2ExcelTool(); //listSet是GirdPanel的id data2Excel.export2Excel(Ext.getCmp('listSet'));
### GridPanel 属性详解 #### 一、Ext.grid.GridPanel 组件概述...以上就是对`Ext.grid.GridPanel`及其相关组件的主要属性和方法的详细解释。通过合理配置这些属性和方法，开发者可以创建出功能强大且美观的表格组件。
EXT GridPanel的列模型（ColumnModel）提供了此方法来映射列索引到数据字段名。 - `record.get(fieldName);` 使用Record对象的get方法，通过字段名获取单元格的值。`fieldName`变量包含了之前获取的列对应的字段名...
在实际应用中，GridPanel还可以与其他组件结合，比如使用Toolbar提供操作按钮，或者嵌入其他复杂的组件，如Charts，以实现数据分析和可视化。 除了GridPanel，ExtJS还提供了许多其他组件，如FormPanel（用于创建...
使用`loadPage`方法加载特定页的数据。 5. **性能优化**： 除了延时加载，还有其他一些性能优化技巧，如分页、数据过滤和排序等。分页可以将大量数据分成多个小部分加载；过滤和排序可以在客户端处理，减少服务器...
在`GridPanel.java`中，会定义Tapestry组件的Java类，包括属性、方法和事件处理逻辑。 3. **配置模板**：编写对应的HTML/TML模板文件，如`GridPanel.tml`，在这个模板中，可以通过Tapestry的标记语言来创建...