转自:http://blog.sina.com.cn/s/blog_454fbf740100t0xj.html

在应用程序的制作中,我们经常性的会用到工具栏,在Extjs中Panel中提供了tbar和bbar两个内置的工具栏,极大的方便了大家的使用,但是在创建多行工具栏的时候,就会有一些问题产生了,不能正常的显示已经设计好的页面。下面通过对Panel的render事件的监听,在它被渲染的时候添加多条工具栏,这样就不会影响页面的显示了。这一方法对Panel,FormPanel,GridPanel都适用。具体代码如下:

Ext.onReady(function(){ 
  var tbar1 = new Ext.Toolbar([

{text:'添加按钮'},{text:'修改按钮'},{text:'删除按钮'}]);

var main = new Ext.Panel({

title:'一个面板',

border:false,

tbar : [{text:'一个按钮'}],

listeners : {

'render': function(){

tbar1.render(main.tbar);

}

}

}); 
  main.render(document.body); 
});

另一个方法,设置EditorGridPanel中两个tbar:

Ext.onReady(function(){
var grid =
new Ext.grid.EditorGridPanel({
  store : ds,
  cm : cm,
  width : 688,
  height : 300,
  selModel : new
Ext.grid.RowSelectionModel(),
  autoScroll : true,
  stripeRows : true,
  enableColumnMove : false,
  clicksToEdit : 1,
  tbar : ['->',
{
   xtype :
'button',
   text :
'添加',
   iconCls :
'icon-add',
   handler :
function() {}))
   }
  }, '-', {
   xtype :
'button',
   text :
'删除',
   iconCls :
'icon-delete',
   handler :
function() {}
  }, ' '],
  listeners : {
   'render' :
function() {
    var
tbar1 = new Ext.Toolbar(['->', {
     text
: "设置",
     iconCls
: 'icon-set',
     handler
: function() {
     }

},
' ']);
    tbar1.render(grid.tbar);

}
  }
 });
});

22.Extjs Panel中显示多行工具栏(tbar)的更多相关文章

  1. DevExpress中barManager下的toolbar如何在panel中显示

    如题,我的Dev Toolbar需要在一个pannel中显示,并且居于最顶部.可是好像默认情况下toolbar都是在窗体的最顶部的,如何设置才能使其位于一个panel的最顶部呢? 解决方案:经过测试, ...

  2. RDLC 设置表的重复标题行(在每页中显示标题行)

    在Tablix 属性对话框中勾选“在每一页上重复标题行”及“滚动时保持标题可见”结果没有用. 如果您使用的是一个“表”式布局,有一个简单的方法,可以尝试以下四个步骤: 1.在分组窗格中,单击窗格上的小 ...

  3. 在Xcode中显示代码行号

    打开一个程序,点击屏幕菜单栏的Xcode,然后选Xcode -> Preferences -> Text Editing -> Show line numbers前面打勾就行了. 如 ...

  4. 如何在VS2013中显示代码行号

    http://jingyan.baidu.com/article/af9f5a2d2e193543140a4533.html

  5. 九十六、SAP中ALV事件之九,显示功能按钮栏中显示ALV加强工具栏

    一.排查了很久,终于找到问题所在.把问题解决了,代码如下: 二.运行效果如下 三.试一试,标准功能都可以用 完美

  6. C#在splitContainer1控件和panel控件中显示窗体

    现在有两个窗体 Form1 和Form2 Form1中有控件splitContainer1 和panel .控件.我们希望Form2在splitContainer1或者panel控件中显示 1:首先看 ...

  7. ExtJS Panel主要配置列表

    Ext.panel.Panel 属性 值 描述 animCollapse Boolean 设置面板折叠展开是否显示动画,Ext.Fx可用默认true,否则false applyTo Mixed 面板定 ...

  8. SQL中将某个表中的多行数据在一个字段显示

    项目需求:将某个表中的多行数据在一个字段显示,如下: 比如表A中有字段 ID,NAME, 表B中有字段ID,PID,DES, 表A,表B中的数据分别如下: ID NAME1 张三2 李四 ID PID ...

  9. 跟我一起学extjs5(13--运行菜单命令在tabPanel中显示模块)

    跟我一起学extjs5(13--运行菜单命令在tabPanel中显示模块)         上面设计好了一个模块的主界面,以下通过菜单命令的运行来把这个模块增加到主界面其中. 在MainModule. ...

随机推荐

  1. 【转载】分布式系列文章——Paxos算法原理与推导

    转载:http://linbingdong.com/2017/04/17/%E5%88%86%E5%B8%83%E5%BC%8F%E7%B3%BB%E5%88%97%E6%96%87%E7%AB%A0 ...

  2. python 调用 C 动态库

    首先是 C 的头文件和源文件, #ifndef POINT_H #define POINT_H struct point { int x; int y; }; void point_print(str ...

  3. 51NOD 2370 奈芙莲的护符

    >>这是原题传送门<< 答案参考来自 http://www.cnblogs.com/sugewud/p/9822933.html 思路:看到取值范围之后,仅有的思路还是暴力

  4. Spring核心技术(六)——Spring中Bean的生命周期

    前文已经描述了Bean的作用域,本文将描述Bean的一些生命周期作用,配置还有Bean的继承. 定制Bean 生命周期回调 开发者通过实现Spring的InitializeingBean和Dispos ...

  5. Django——配置服务器上线

    使用UWSGI和NGINX配置项目上线 首先你得有一个拿得出手的项目 其次,购买了域名,也备案成功了 将settings.py中的DEBUG设置为False 配置Uwsgi 在项目(哪里都可以)中创建 ...

  6. Jmeter关联-获取token值

    1. token就是令牌,比如你授权(登录)一个程序时,他就是个依据,判断你是否已经授权该软件:也叫关联 2. cookie就是写在客户端的一个txt文件,里面包括你登录信息之类的,这样你下次在登录某 ...

  7. java生成6位随机数字

    //生成6位随机数字 System.out.println((int)((Math.random()*9+1)*100000)); //生成5位随机数字 System.out.println((int ...

  8. topcoder SRM 639 div2

    见这里 http://ygdtc.sinaapp.com/?p=257

  9. Java面试题解析(一)

    本文是面试题目系列的第一篇,题目主要来自 GitChat 上一个课程,在此特别记录自身想的答案和在网上查询的结果,分享出来,大家共同学习.如果有不对的地方,欢迎大家指出. Java基础 JDK 和 J ...

  10. Ionic3错误记录:navigation stack needs at least one root page

    BUG场景:在 ActionSheetController 使用modalCtrl.create 创建模态框时报如下错误 原代码片段 解决方式: 重新设置root page