您的位置：首页 > 其它

Ext中显示多行tbar方法

2015-07-30 11:37 337 查看 
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>ExtJS</title>
<link rel="stylesheet" type="text/css" href="/js/ext-3.4.0/resources/css/ext-all.css" />
<!--
注意：ext-base.js必须放在ext-all.js前面
-->
<script type="text/javascript" src="/js/ext-3.4.0/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="/js/ext-3.4.0/ext-all.js"></script>
<script>
var oneTbar=new Ext.Toolbar({
items:[
{text:'复制'},
{text:'粘贴'}
] });

var twoTbar=new Ext.Toolbar({
items:[  new Ext.Toolbar.TextItem('工具栏') //显示文本
]

});

var threeTbar=new Ext.Toolbar({
items:[
{xtype:"tbfill"}, //后面的tools显示在右边
{pressed:true,text:'刷新'}
]

});

var win=new Ext.Window({
title :'演示多行tbar',
width :500,
height :300,
modal : false,
renterTo :Ext.getBody(),
items:[{
xtype :'panel',
tbar :[
{
text:'添加'
},'-',
{
text:'删除'
}, '-',
{
text:'修改'
}],
listeners : {
'render' : function(){
oneTbar.render(this.tbar); //add one tbar
twoTbar.render(this.tbar); //add two tbar
threeTbar.render(this.tbar); //add three tbar
}
}
}]
});
win.show();
</script>
</head>
<body>
</body>
</html>
要点 1var oneTbar=new Ext.Toolbar能被 rander 的 tbar 不能为普通的 js 数组要为 Ext.Toolbar 类型要点 2window 或者 grid 中的tbar :[{text:'添加'},'-',{text:'删除'},'-',{text:'修改'}],不能为空，否则整个页面布局混乱要点 3再次理解listeners 和 this注意：这一方法对 Panel，FormPanel，GridPanel 都有效但是对 Window 无效，所以要在 Window 中嵌入 Panel
                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航