extjs bbar显示怎么在顶部，要把鼠标移到上面去才能恢复正确的位置

Question

代码如下：AddTabPage = Ext.extend(TabPage, {
constructor: function(_config){
    if (null == _config){
     _config = {};
    }
    
    Ext.apply(this,_config);
    
    AddTabPage.superclass.constructor.call(this, {
     bbar : [{
text : "确认添加",
iconCls : "houfei-addicon",
scope : this
},{
text : "取消添加",
iconCls : "houfei-tbarCancelIcon",
//handler : this.onCancelAddPersonFile,
scope : this
}]
    });
    }})
--------------------------------------------------------------------------------------------------------------TabPage = Ext.extend(Ext.form.FormPanel, {
        myid : "default",        constructor : function(_config) {
                if (null == _config) {
                        _config = {};
                }
                Ext.apply(this, _config);
                
                TabPage.superclass.constructor.call(this, {
                    title : "监测器添加向导",
                    collapsible : true,
                    layout : 'accordion',
                    frame : true,
                    defaults : {
                     border : false
                    },
                    items : [{
                        title : "必填项目",
                               html : "some content"
                       },{
                        title : "选填项目",
                               html : "some content"
                       }]
                });
        }
});请高手解释为什么？再提出解决办法？

Answer 1

如果其他代码没有问题，那很可能是layout : 'accordion'出了问题

Answer 2

的确是这个layout：accordion 引起的  但我又必须要这种手风琴的效果啊  怎么办？

Answer 3

你的需求是需要一个layout：accordion 的容器并且所有的子项都共享一个bbar是吧？
那就把layout：accordion 的容器作为你的FormPanel的一个子容器就可以了，只要不影响bbar所在容器的排版就好，类似于：   new Ext.form.FormPanel({
      ...
      bbar: [...],
      items: {
         xtype: 'panel',
         layout : 'accordion',
         .....
      }
   })未经测试，仅供参考