extjs 怎么向TabPanel中加入一个 FormPanel
TabPanel的代码如下:
Ext.onReady(function(){
var tabs = new Ext.TabPanel({
renderTo:'tabs',
resizeTabs:true, // turn on tab resizing
minTabWidth: 115,
tabWidth:135,
enableTabScroll:true,
width:584,
height:250,
defaults: {autoScroll:true},
plugins: new Ext.ux.TabCloseMenu()
});
// tab generation code
var index = 0;
while(index < 3){
addTab();
}
function addTab(){
tabs.add({
title: '用户信息 ' + (++index),
iconCls: 'tabs',
html: '表格 ' + (index) + '<br/><br/>'
+ Ext.example.bogusMarkup,
//items: simple,
closable:true
}).show();
}
new Ext.Button({
text: '添加一表格',
handler: addTab,
iconCls:'new-tab'
}).render(document.body, 'tabs');
});
FormPanel的代码如下:
var simple = new Ext.FormPanel({
labelWidth: 60, // label settings here cascade unless overridden
url:'dynamic.html',
frame:true,
title: '',
bodyStyle:'padding:5px 5px 0',
width: 350,
defaults: {width: 230},
defaultType: 'textfield',
items: [{
fieldLabel: '乘机人',
name: 'AirPerson',
allowBlank:false
},{
fieldLabel: '证件类型',
name: 'Id'
},{
fieldLabel: '证件号码',
name: 'IdNo'
}, {
fieldLabel: '国籍',
name: 'country' ,
}, new Ext.form.ComboBox({
fieldLabel: 'State',
hiddenName:'state',
store: new Ext.data.SimpleStore({
fields: ['abbr', 'state'],
data : Ext.exampledata.states // from states.js
}),
valueField:'abbr',
displayField:'state',
typeAhead: true,
mode: 'local',
triggerAction: 'all',
emptyText:'请选择性别...',
selectOnFocus:true,
width:190
}),{
fieldLabel: '出生日期',
name: 'birthday'
},{
fieldLabel: '联系电话',
name: 'telephone'
},{
fieldLabel: '签发地',
name: 'visaAddress'
}
],
buttons: [{
text: '保存'
},{
text: '取消'
}]
});
simple.render(document.body);
我遇到的问题是怎么把这个form 加入到这个table中去,向高手请较!
Ext.onReady(function(){
var tabs = new Ext.TabPanel({
renderTo:'tabs',
resizeTabs:true, // turn on tab resizing
minTabWidth: 115,
tabWidth:135,
enableTabScroll:true,
width:584,
height:250,
defaults: {autoScroll:true},
plugins: new Ext.ux.TabCloseMenu()
});
// tab generation code
var index = 0;
while(index < 3){
addTab();
}
function addTab(){
tabs.add({
title: '用户信息 ' + (++index),
iconCls: 'tabs',
html: '表格 ' + (index) + '<br/><br/>'
+ Ext.example.bogusMarkup,
//items: simple,
closable:true
}).show();
}
new Ext.Button({
text: '添加一表格',
handler: addTab,
iconCls:'new-tab'
}).render(document.body, 'tabs');
});
FormPanel的代码如下:
var simple = new Ext.FormPanel({
labelWidth: 60, // label settings here cascade unless overridden
url:'dynamic.html',
frame:true,
title: '',
bodyStyle:'padding:5px 5px 0',
width: 350,
defaults: {width: 230},
defaultType: 'textfield',
items: [{
fieldLabel: '乘机人',
name: 'AirPerson',
allowBlank:false
},{
fieldLabel: '证件类型',
name: 'Id'
},{
fieldLabel: '证件号码',
name: 'IdNo'
}, {
fieldLabel: '国籍',
name: 'country' ,
}, new Ext.form.ComboBox({
fieldLabel: 'State',
hiddenName:'state',
store: new Ext.data.SimpleStore({
fields: ['abbr', 'state'],
data : Ext.exampledata.states // from states.js
}),
valueField:'abbr',
displayField:'state',
typeAhead: true,
mode: 'local',
triggerAction: 'all',
emptyText:'请选择性别...',
selectOnFocus:true,
width:190
}),{
fieldLabel: '出生日期',
name: 'birthday'
},{
fieldLabel: '联系电话',
name: 'telephone'
},{
fieldLabel: '签发地',
name: 'visaAddress'
}
],
buttons: [{
text: '保存'
},{
text: '取消'
}]
});
simple.render(document.body);
我遇到的问题是怎么把这个form 加入到这个table中去,向高手请较!
...全文
相关推荐
EXT详解.pdf 好资料
- **Grid**: 是一个表格组件,能够展示大量数据,并支持排序、过滤等功能。 - **更多组件**: 除了上述两种外,EXT还提供了大量的其他组件,如TabPanel、FormPanel等。
ExtJs使用过程中积攒的一些东西
**Ext.TabPanel**: - TabPanel是ExtJs中的一个多标签面板,用于展示多个页面内容。
Extjs帮助文档.pdf
根据提供的文件信息,我们可以深入探讨Extjs中几个关键组件及其用法。Extjs是一个用于构建交互式Web应用程序的JavaScript框架,特别适用于创建复杂的用户界面。
extjs扩展标记
- **TabPanel**:用于组织多个视图,每个视图都可以在一个标签页中展示。
ExtJs入门实例
### ExtJs2.0入门实例知识点详解#### 1. Ext.MessageBox- **Ext.MessageBox.alert()** - **用途**: 显示一个简单的警告框。


