Extjs 4.0 Tab页
2024-10-04 20:04:30
1、JSON代码
Ext.MyTabs=Ext.extend(Ext.TabPanel ,{
xtype:"tabpanel",
activeTab:2,
width:694,
height:571,
initComponent: function(){
this.items=[
{
xtype:"panel",
title:"学生",
autoScroll:false,
width:703,
items:[
{
xtype:"grid",
title:"我的表格",
columns:[
{
header:"学号",
sortable:true,
resizable:true,
dataIndex:"data1",
width:100
},
{
header:"姓名",
sortable:true,
resizable:true,
dataIndex:"data2",
width:100
},
{
header:"性别",
sortable:true,
resizable:true,
dataIndex:"data3",
width:100
},
{
header:"年龄",
sortable:true,
resizable:true,
dataIndex:"",
width:100
},
{
header:"电话",
sortable:true,
resizable:true,
dataIndex:"",
width:100
},
{
header:"住址",
sortable:true,
resizable:true,
dataIndex:"",
width:100
},
{
header:"QQ",
sortable:true,
resizable:true,
dataIndex:"",
width:100
}
]
}
]
},
{
xtype:"panel",
title:"教师",
items:[
{
xtype:"grid",
title:"我的表格",
columns:[
{
header:"工号",
sortable:true,
resizable:true,
dataIndex:"data1",
width:100
},
{
header:"姓名",
sortable:true,
resizable:true,
dataIndex:"data2",
width:100
},
{
header:"年龄",
sortable:true,
resizable:true,
dataIndex:"data3",
width:100
},
{
header:"性别",
sortable:true,
resizable:true,
dataIndex:"",
width:100
},
{
header:"电话",
sortable:true,
resizable:true,
dataIndex:"",
width:100
},
{
header:"电话",
sortable:true,
resizable:true,
dataIndex:"",
width:100
},
{
header:"QQ",
sortable:true,
resizable:true,
dataIndex:"",
width:100
}
]
}
]
},
{
xtype:"panel",
title:"课程",
items:[
{
xtype:"grid",
title:"我的表格",
columns:[
{
header:"编号",
sortable:true,
resizable:true,
dataIndex:"data1",
width:100
},
{
header:"名称",
sortable:true,
resizable:true,
dataIndex:"data2",
width:100
},
{
header:"教授教师",
sortable:true,
resizable:true,
dataIndex:"data3",
width:100
},
{
header:"选课人数",
sortable:true,
resizable:true,
dataIndex:"",
width:100
},
{
header:"上课时间",
sortable:true,
resizable:true,
dataIndex:"",
width:100
},
{
header:"分数",
sortable:true,
resizable:true,
dataIndex:"",
width:100
},
{
header:"学生学号",
sortable:true,
resizable:true,
dataIndex:"",
width:100
}
]
}
]
}
]
Ext.MyTabs.superclass.initComponent.call(this);
}
})
2、执行结果
（1）学生Tab页
（2）教师Tab页
（3）课程Tab页
最新文章
- 数独 JAVA实现
- OAuth2.0 四种授权模式
- netperf安装及使用
- qt中添加Q_OBJECT报错的问题
- pycharm 中 pep8 检查开启.
- [插件]jQuery multiselect初始化及默认值修改
- Andrew Ng机器学习公开课笔记 -- Mixtures of Gaussians and the EM algorithm
- python7 静态方法、类方法、属性方法 ；反射；异常处理
- hdu----(1599)最大子矩阵(几何/dp)
- Nginx 的 RTMP 模块的在线统计功能 stat 在 multi-worker 模式下存在 Bug
- struts 2学习笔记—浅谈struts的线程安全
- django自带User管理中添加自己的字段方法
- Python:爬取乌云厂商列表，使用BeautifulSoup解析
- mapreduce任务失败、重试、猜測式运行机制小结
- AJAX同步和异步的区别
- （python）剑指Offer（第二版）面试题14：剪绳子
- POJ1830开关问题
- opencontrail—VXLAN模式下数据包的传输过程
- curl用法一例 传递代理用户名密码
- python pandas使用数据透视表