ext grid 增加 多个 toolbar

最近项目中客户提出的搜索条件很多，有的达2位数，一行toolbar明显不够用了，默认情况下ext一行toolbar过长时后面的内容就自动隐藏了，在extjs上面翻了又翻，找到一个办法，很简单，再增加一个toolbar。一个测试的简短grid代码

  // create the editor grid
    var grid = new Ext.grid.EditorGridPanel({
        store: store,
        cm: cm,
        renderTo: 'editor-grid',
        width:600,
        height:300,
        autoExpandColumn:'common',
        title:'Edit Plants?',
        frame:true,
        plugins:checkColumn,
        clicksToEdit:1,

        tbar: new Ext.Toolbar({
            autoWidth:true,
                autoShow:true,
            items:[
            {text: 'there is a add button for test'},
               '-',
               '->',
               {text: 'there is a update button for test'},

                {text: 'there is a delete button for test'}
        ]
         })
    });


this.bbar2 = new Ext.Toolbar({
            renderTo:grid.tbar
            ,items:['Example of second toolbar', '-', {
                 text:'Button'
                ,iconCls:'icon-key'
            }, '-'
            ]
        });



    // trigger the data store load
    store.load();
});

  // create the editor grid
    var grid = new Ext.grid.EditorGridPanel({
        store: store,
        cm: cm,
        renderTo: 'editor-grid',
        width:600,
        height:300,
        autoExpandColumn:'common',
        title:'Edit Plants?',
        frame:true,
        plugins:checkColumn,
        clicksToEdit:1,

        tbar: new Ext.Toolbar({
			autoWidth:true,
				autoShow:true,
			items:[
			{text: 'there is a add button for test'},
			   '-',
			   '->',
			   {text: 'there is a update button for test'},
			   
                {text: 'there is a delete button for test'}
		]
		 })
    });


this.bbar2 = new Ext.Toolbar({
            renderTo:grid.tbar
            ,items:['Example of second toolbar', '-', {
                 text:'Button'
                ,iconCls:'icon-key'
            }, '-'
            ]
        });



    // trigger the data store load
    store.load();
});

 其中bbar2就是新增加的toolbar -_-!,再

renderTo:grid.tbar

renderTo:grid.tbar

 

by the way,用chrome编辑完发现插入代码没有保存按键....@##%%#

 

• 大小: 14 KB