Results 1 to 5 of 5

Thread: [SOLVED][3.??] comboBox on toolbar bug

  1. #1

    Default [SOLVED][3.??] comboBox on toolbar bug

    [b][u]Ext version tested:[/u][/b]
    • Ext JS 3.0.0

    [
    b][u]Adapter used:[/u][/b]
    • ext

    [
    b][u]css used:[/u][/b]
    • only default ext-all.css



    [
    b][u]Browser versions tested against:[/u][/b]
    • FF3 (firebug 1.3.0.10 installed)

    [
    b][u]Operating System:[/u][/b]
    • vista

    [
    b][u]Description:[/u][/b]
    Well Im trying to put toolbar inside a menu of a button, what it does is that is shows the toolbar but
    it does not show the components of my tool bar. So what I did was that instead of creating a toolbar directly
    I created a panel an then inside the panel I created the toolbar inside the tbar of the panel, so it did work
    ,but when I put a combo inside that toolbar the dropdown list hides behind the menu item of the botton , I have tried the simpliest
    case where I put directly the combo to the menu of the button and it hides too . you can see the code and the screenshots.
    thanks in advance
    • See screenshot

    [
    b][u]Test Case:[/u][/b]
    1.-Simpliest test case
    [
    code]
    Ext.onReady(function() {
    Ext.QuickTips.init();
    Ext.form.Field.prototype.msgTarget = 'side';
    var panelPruebas=new Ext.Panel({
    renderTo:Ext.getBody(),
    tbar:[{
    xtype:'buttongroup',
    items:[{
    text:'<b><br>Buscar Usuario',
    scale:'large',
    iconAlign:'top',
    menu : {

    items:[{
    xtype:'combo',
    fieldLabel:'Nivel de Acceso',
    name:'cb-nivel',
    store:[['Vendedor','Vendedor'],['Contador','Contador']],
    editable:false,
    triggerAction: 'all',
    emptyText:'Elige nivel de acceso...',
    hideTrigger:true,
    forceSelection:true
    },'-',{
    text:'<b><br> Buscar </b>',
    scale:'large',
    iconAlign: 'top'
    },'-',{
    text:'<b><br>Limpiar</b>',
    scale:'large',
    iconAlign: 'top'
    }]

    }
    }]
    }

    ]
    });
    });

    [/
    code]
    2.- The toolbar but not its components

    Code:
    Ext.onReady(function() {                
        Ext.QuickTips.init();
        Ext.form.Field.prototype.msgTarget = 'side';    
        var panelPruebas=new Ext.Panel({
            renderTo:Ext.getBody(),
            tbar:[{
                         xtype:'buttongroup',
                         items:[{
                                       text:'<b><br>Buscar Usuario',
                                       scale:'large',
                                       //iconCls:'fUser',
                                       iconAlign:'top',                       
                                       menu :{
                                               items:[    new Ext.Toolbar({
                                                  height:50,
                                                  witdth:500
                                                   items:[{
                                                            xtype:'combo',
                                                            fieldLabel:'Nivel de Acceso',
                                                            name:'cb-nivel',
                                                            store:[['Vendedor','Vendedor'],['Contador','Contador']],
                                                            editable:false,
                                                            triggerAction: 'all',
                                                            emptyText:'Elige nivel de acceso...',
                                                            hideTrigger:true,
                                                            forceSelection:true
                                                        },'-',{
                                                               text:'<b><br> Buscar </b>',
                                                               scale:'large',
                                                               //iconCls:'buscar',
                                                               iconAlign: 'top'                                                           
                                                           },'-',{
                                                               text:'<b><br>Limpiar</b>',
                                                               scale:'large',
                                                               //iconCls:'limpiar',
                                                               iconAlign: 'top'                                                           
                                                           }]
                                               })
                                           ]
                                   }
                                               
                                                             
                                   }]
                       }
                
            ]
        });
    });
    3.- A panel with a tool bar but the dropdown of the combo behind
    Code:
    Ext.onReady(function() {                
        Ext.QuickTips.init();
        Ext.form.Field.prototype.msgTarget = 'side';    
        var panelPruebas=new Ext.Panel({
            renderTo:Ext.getBody(),
            tbar:[{
                         xtype:'buttongroup',
                         items:[{
                                       text:'<b><br>Buscar Usuario',
                                       scale:'large',
                                       //iconCls:'fUser',
                                       iconAlign:'top',                       
                                       menu : {
                                               items:new Ext.Panel({
                                               width:800,
                                               autoHeight:true,
                                               //title:'jeje',
                                               tbar:new Ext.Toolbar({
                                               height:50,
                                                   items:[{
                                                            xtype:'combo',
                                                            fieldLabel:'Nivel de Acceso',
                                                            name:'cb-nivel',
                                                            store:[['Vendedor','Vendedor'],['Contador','Contador']],
                                                            editable:false,
                                                            triggerAction: 'all',
                                                            emptyText:'Elige nivel de acceso...',
                                                            hideTrigger:true,
                                                            forceSelection:true
                                                        },'-',{
                                                               text:'<b><br> Buscar </b>',
                                                               scale:'large',
                                                               //iconCls:'buscar',
                                                               iconAlign: 'top'                                                           
                                                           },'-',{
                                                               text:'<b><br>Limpiar</b>',
                                                               scale:'large',
                                                               //iconCls:'limpiar',
                                                               iconAlign: 'top'                                                           
                                                           }]
                                               })
                                               })
                                       }                       
                                   }]
                       }
                
            ]
        });
    });
    [
    b]See this URL :[/b] http://


    [b][u]Steps to reproduce the problem:[/u][/b]
    • foo
    • bar

    [
    b][u]The result that was expected:[/u][/b]
    • dropdown in front of the tool bar

    [
    b][u]The result that occurs instead:[/u][/b]
    • it is behind

    [
    b][u]Screenshot or Video:[/u][/b]
    • 1.-
    Last edited by manduks; 29 Jul 2009 at 5:31 PM. Reason: [Solved]

  2. #2

  3. #3

    Default

    why moved isnt this a bug? ,anybody has a workaround for thi issue I have tried a lot of things but did not work

  4. #4
    Ext User
    Join Date
    Jul 2007
    Location
    Florida
    Posts
    9,996

    Default

    Seems that you're either asking for help or potentially are encountering a previously reported behavior, see here:
    http://extjs.com/forum/showthread.ph...546#post351546

    See the related links and posts.

  5. #5

    Default

    sorry, i just didnt find that tread thank you very much for the help, best luck and lol

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •