EXTJS 3.0 资料 控件之 Toolbar 两行的用法

 

 var toolbarCarType = new Ext.Toolbar({
        //width: 500,
        //autoWidth:true,
        pressed: false,
        toggleGroup: 'butToolbar',
        allowDepress: false
    });
    toolbarCarType.add(
        {
            text: '汽车商标',
            icon: '/Image/icon_padlock.png',
            id: "btnTrademarkCar",
            handler: function () {
                card.getLayout().setActiveItem(0);
            }
        },
        {
            text: '汽车产地或子品牌',
            icon: '/Image/icon_padlock.png',
            id: 'btnTrademarkCarLocation',
            handler: function () {
                card.getLayout().setActiveItem(1);
            }
        },
        {
            text: '汽车车系',
            icon: '/Image/icon_padlock.png',
            id: 'btnSeriesCar',
            handler: function () {
                card.getLayout().setActiveItem(2);
            }
        }, {
            text: '汽车型号',
            icon: '/Image/icon_padlock.png',
            id: 'btnModelNumberCar',
            handler: function () {
                card.getLayout().setActiveItem(3);
            }
        },  "->", '车系：', { xtype: "textfield", id: "txtModelNumber", name: "txtModelNumber" } ,     {
            text: '汽车产品单元PKU',
            icon: '/Image/icon_padlock.png',
            id: 'btnPKU',
            handler: function () {
                card.getLayout().setActiveItem(4);
            }
        } 
    );
    var toolbarWork = new Ext.Toolbar({
        items: [{ text: '执行操作：', width: 20 },
                {
                    text: '宝马', icon: '/Image/icon_padlock.png', id: 'btn_tw_TrademarkCar', width: 20,
                    handler: function () {
                        card.getLayout().setActiveItem(0);
                    }
                },
                {
                    text: '产地', icon: '/Image/icon_padlock.png', id: 'btn_tw_TrademarkCarLocation', width: 20,
                    handler: function () {
                        card.getLayout().setActiveItem(1);
                    }
                },
                {
                    text: '车系', icon: '/Image/icon_padlock.png', id: 'btn_tw_SeriesCar', width: 20,
                    handler: function () {
                        card.getLayout().setActiveItem(2);
                    }
                },
                {
                    text: '型号', icon: '/Image/icon_padlock.png', id: 'btn_tw_ModelNumberCar', width: 20,
                    handler: function () {
                        card.getLayout().setActiveItem(3);
                    }
                }
        ]
    });

 

在panel中插入的代码：

   tbar: toolbarCarType,
        listeners: {
            'render': function () { //将tbar1添加到main.tbar的下面 
                toolbarWork.render(card.tbar);
            }
        },