Ext gridpanel

gridpanel是EXT中很常见的一个显示数据的组件。

上例子：

Ext.onReady(function() {
			var data = [[1, 'EasyJWeb', 'EasyJF', 'www.easyjf.com'],

					[2, 'jfox', 'huihoo', 'www.huihoo.org'],

					[3, 'jdon', 'jdon', 'www.jdon.com'],

					[4, 'springside', 'springside', 'www.springside.org.cn']];

			var store = new Ext.data.SimpleStore({
						data : data,
						fields : ["id", "name", "organization", "homepage"]
					});

			var colM = new Ext.grid.ColumnModel([{
						header : "项目名称",
						dataIndex : "name",
						sortable : true
					},

					{
						header : "开发团队",
						dataIndex : "organization",
						sortable : true
					},

					{
						header : "网址",
						dataIndex : "homepage",
					}]);

			var grid = new Ext.grid.GridPanel({

						renderTo : Ext.getBody(),

						title : "中国Java开源产品及团队",

						height : 200,

						width : 600,

						cm : colM,

						store : store,

						autoExpandColumn : 2

					});

		});

显示的结果如图：

其中的store还可以是json及xml。更多的属性可以参考文档或者这篇文章

http://www.blogjava.net/wangdetian168/archive/2011/04/12/348651.html

 

这里有一个更复杂的例子，带有tbar和bbar及右键单击的动作

http://www.cnblogs.com/luluping/archive/2009/08/01/1536645.html

 

总结一下，gridpanel是EXT中最常见和最基本的显示数据的组件。要了解好其API，注意其和store的搭配使用，另外就是sm及cm的属性。