extjs tab 标签上方的汉字显示不全
时间:2011-11-19
来源:互联网
开发用的extjs4,如下图,“来宾用餐申请”,中文几个字的最上面被消去了,怎么设置正确呢?
是点击左面的树,弹出的tab页。
先是建立的tabpanel,然后在点击函数中,添加tab。
var center_panel=Ext.createWidget('tabpanel',
{
id:'panleCenter',
region:'center',
plain:true,
frame:false,
border:false,
split:true,
activeTab: 0,
defaults :{
bodyPadding: 10
},
items: [
{
closable: true,
xtype:"panel",layout:'fit',title:' ',border:false,frame:false,iconCls: 'indexicon',
html:"<iframe scrolling='no' width='100%' height='100%' frameborder='0' src='Page/BAS/HomePage.htm'></iframe>"
}
]
});
function tabadd(rec)
{
var tab = center_panel.add({
closable: true,
title: rec.raw.text, //tab页名称
xtype:"panel",layout:'fit',border:false,frame:false,
html:"<iframe scrolling='no' width='100%' height='100%' frameborder='0' src='"+rec.raw.url+"'></iframe>"
});
center_panel.setActiveTab(tab);
}
是点击左面的树,弹出的tab页。
先是建立的tabpanel,然后在点击函数中,添加tab。
var center_panel=Ext.createWidget('tabpanel',
{
id:'panleCenter',
region:'center',
plain:true,
frame:false,
border:false,
split:true,
activeTab: 0,
defaults :{
bodyPadding: 10
},
items: [
{
closable: true,
xtype:"panel",layout:'fit',title:' ',border:false,frame:false,iconCls: 'indexicon',
html:"<iframe scrolling='no' width='100%' height='100%' frameborder='0' src='Page/BAS/HomePage.htm'></iframe>"
}
]
});
function tabadd(rec)
{
var tab = center_panel.add({
closable: true,
title: rec.raw.text, //tab页名称
xtype:"panel",layout:'fit',border:false,frame:false,
html:"<iframe scrolling='no' width='100%' height='100%' frameborder='0' src='"+rec.raw.url+"'></iframe>"
});
center_panel.setActiveTab(tab);
}

作者: yangzhuofeng 发布时间: 2011-11-19
rec.raw.text 是定义的tab页名称,是一个变量,如来宾用餐记录
作者: yangzhuofeng 发布时间: 2011-11-19
看下例在panel的标题中添加一个空格 即可。在extjs4.0中调试过。
var myPanel1=Ext.create('Ext.panel.Panel',{
title:' 基本信息',
//region:'south', //组件布局区域
containerScroll:true,//是否有滚动条
collapsible: true, //是否可收缩
items:[myForm1]
});
var myPanel2=Ext.create('Ext.panel.Panel',{
title:' 个人信息',
height:600,
width:600,
containerScroll:true,//是否有滚动条
collapsible: true, //是否可收缩
items:[myForm2]
});
var myPanel3=Ext.create('Ext.panel.Panel',{
title:' 个人照片',
height:600,
width:900,
containerScroll:true,//是否有滚动条
collapsible: true, //是否可收缩
items:[myForm3]
});
var mytab = Ext.create('Ext.tab.Panel',{
id:'mytab',
region:'center',
height: 680,
width:'60%',
pressed:true,
activeTab: 0,//默认激活第一个tab页面
//defaults:{bodyStyle:'padding:10px'},
containerScroll:false,
items:[myPanel1,myPanel2,myPanel3],
buttons:[
{id:'send', text:'提交',handler: fnSaveRecord},
{id:'cancel',text:'取消'}
]
});
var myPanel1=Ext.create('Ext.panel.Panel',{
title:' 基本信息',
//region:'south', //组件布局区域
containerScroll:true,//是否有滚动条
collapsible: true, //是否可收缩
items:[myForm1]
});
var myPanel2=Ext.create('Ext.panel.Panel',{
title:' 个人信息',
height:600,
width:600,
containerScroll:true,//是否有滚动条
collapsible: true, //是否可收缩
items:[myForm2]
});
var myPanel3=Ext.create('Ext.panel.Panel',{
title:' 个人照片',
height:600,
width:900,
containerScroll:true,//是否有滚动条
collapsible: true, //是否可收缩
items:[myForm3]
});
var mytab = Ext.create('Ext.tab.Panel',{
id:'mytab',
region:'center',
height: 680,
width:'60%',
pressed:true,
activeTab: 0,//默认激活第一个tab页面
//defaults:{bodyStyle:'padding:10px'},
containerScroll:false,
items:[myPanel1,myPanel2,myPanel3],
buttons:[
{id:'send', text:'提交',handler: fnSaveRecord},
{id:'cancel',text:'取消'}
]
});
作者: zxywolf 发布时间: 2012-10-05
相关阅读 更多
热门阅读
-
office 2019专业增强版最新2021版激活秘钥/序列号/激活码推荐 附激活工具
阅读:74
-
如何安装mysql8.0
阅读:31
-
Word快速设置标题样式步骤详解
阅读:28
-
20+道必知必会的Vue面试题(附答案解析)
阅读:37
-
HTML如何制作表单
阅读:22
-
百词斩可以改天数吗?当然可以,4个步骤轻松修改天数!
阅读:31
-
ET文件格式和XLS格式文件之间如何转化?
阅读:24
-
react和vue的区别及优缺点是什么
阅读:121
-
支付宝人脸识别如何关闭?
阅读:21
-
腾讯微云怎么修改照片或视频备份路径?
阅读:28