Ext.TabPanel组件

bj_dxd

浏览: 24637 次
性别:
来自: 北京

最近访客更多访客>>

h416373073

liaoze

eandy

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

EXT JavaScript CSS HTML

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
   	<link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css" />
	<script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>
	<script type="text/javascript" src="extjs/ext-all.js"></script>
	<script type="text/javascript" src="extjs/ext-all-debug.js"></script>
	<script type="text/javascript">
		Ext.onReady(function(){
		
			var tabs=new Ext.TabPanel({
				renderTo:document.body,
				height:200,
				enableTabScroll: true//左右滚动
			});
			
			tabs.add({
				title:'标题1',
				html:'内容1'
				//autoLoad: {url: '02-05c1.html'}
			});
			
			tabs.add({
				id:Ext.id(),
				title:'标题2',
				html:'内容2',
				closable:true//是否关闭选项卡
			});
			
			tabs.activate(0);
			
			var addgrid=new Ext.Button({
				text:'添加一个grid',
				renderTo:document.body,
				handler:addgrid
			});
			
			
			function addgrid(){
				//Ext.Msg.alert('标题','内容说明');
				var id=Ext.id();
				var store=new Ext.data.SimpleStore({
					fields:['id','name'],
					data:[
						['1','name1'],
						['2','name2']
					]
				});
				
				var columns=new Ext.grid.ColumnModel([
					{header:'序号',dataIndex:'id'},
					{header:'名称',dataIndex:'name'}
				]);
				
				var grid=new Ext.grid.GridPanel({
					store:store,
					cm:columns
				});
				
				var tab=tabs.add({
					title:'表格'+id,
					closable:true,
					layout:'fit',
					items:[grid]
				});
				
				tabs.activate(tab);
			}
			
			
			
			
			var addpanel=new Ext.Button({
				text:'添加一个panel',
				renderTo:document.body,
				handler:addpal
			});
			
			function addpal(){
				var id=Ext.id();
				var panel=new Ext.Panel({
					html:'aaaaaaaaaaaaaaa'
				});
				
				var tab=tabs.add({
					title:'panel'+id,
					closable:true,
					layout:'fit',
					items:[panel]
				});
				
				tabs.activate(tab);
			}
			
		});
	</script>
  </head>
  <body> 
  </body>
</html>

分享到：

简单的GridPanel实例 | Ext.Panel组件

2010-10-13 20:40
浏览 1048
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

Ext.TabPanel组件

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

Ext.TabPanel组件

评论

发表评论

相关推荐

简单的GridPanel实例

Ext.Panel组件

Ext.BoxComponent类

Ext事件示例（Ext.Msg.alert）

使用ExtJS2构造动态异步加载的树

Ext3.2 direct与Java配置

对话框HelloWorld

最近访客更多访客>>