1. #1
    Sencha User siebmanb's Avatar
    Join Date
    Aug 2011
    Location
    Geneva (CH) - Grenoble (FR)
    Posts
    253
    Answers
    11
    Vote Rating
    15
    siebmanb will become famous soon enough

      0  

    Default Answered: Button below Panel stays docked

    Answered: Button below Panel stays docked


    Hello everyone,

    I have a simple problem for you today. Inside an Ext.Panel, I have an Ext.DataView and an Ext.Button. My DataView is filled by data from my server, it works fine.

    My problem : the Ext.Button is at the bottom of the Panel, hidden behind my tabs. I can move the button, using CSS (position:relative;top:-30px) but it stays docked to the bottom and doesn't move while scrolling the DataView...

    Here is a sample of the code :

    Code:
    app.views.MBProjetPresentationView = Ext.extend(Ext.Panel, {
        items: [{
            xtype: 'dataview',
            scroll: 'vertical',
            height: '100%',
        },
        {
            ui: 'bouton',
            xtype: 'button',
        }],
    });
    Any idea why the button stays docked ?

    Thanks you all

  2. Thanks a lot.

    I changed my layout a bit, works fine now. Here is the new layout :

    Code:
    app.views.MyView = Ext.extend(Ext.Panel, {
        scroll: 'vertical',
        height: '100%',
    
    
        items: [{
            items: [{
                xtype: 'dataview',
            },
            {
                xtype: 'button',
            }]
        }]
    });

  3. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,916
    Answers
    655
    Vote Rating
    443
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    You are adding another item to your panel. If you want a button inside your dataview that scrolls, then you would have to create a button using CSS for example to be part of the view itself .. or did I not understand?

    Regards,
    Scott.

  4. #3
    Sencha User siebmanb's Avatar
    Join Date
    Aug 2011
    Location
    Geneva (CH) - Grenoble (FR)
    Posts
    253
    Answers
    11
    Vote Rating
    15
    siebmanb will become famous soon enough

      0  

    Default


    That would actually work yes but I want to use the power of ExtJS and use its button element...
    I am adding another element to my panel yes, but why the panel does not include the button at the bottom of the DataView ?

  5. #4
    Sencha - Community Support Team
    Join Date
    Jan 2012
    Posts
    1,376
    Answers
    346
    Vote Rating
    113
    vietits is a name known to all vietits is a name known to all vietits is a name known to all vietits is a name known to all vietits is a name known to all vietits is a name known to all

      0  

    Default


    Quote Originally Posted by siebmanb View Post
    Hello everyone,

    I have a simple problem for you today. Inside an Ext.Panel, I have an Ext.DataView and an Ext.Button. My DataView is filled by data from my server, it works fine.

    My problem : the Ext.Button is at the bottom of the Panel, hidden behind my tabs. I can move the button, using CSS (position:relative;top:-30px) but it stays docked to the bottom and doesn't move while scrolling the DataView...

    Here is a sample of the code :

    Code:
    app.views.MBProjetPresentationView = Ext.extend(Ext.Panel, {
        items: [{
            xtype: 'dataview',
            scroll: 'vertical',
            height: '100%',
        },
        {
            ui: 'bouton',
            xtype: 'button',
        }],
    });
    Any idea why the button stays docked ?

    Thanks you all
    1. You defined dataview with its height set to '100%' so it will occupy all the space of parent panel. That causes the button is hidden because it is outside of panel viewport. If you set height to less than 100%, the button will show in the space of parent panel.
    2. Because the button is a sibbling but not child of dataview so when the content of dataview is scrolled the button will stand still.

  6. #5
    Sencha User siebmanb's Avatar
    Join Date
    Aug 2011
    Location
    Geneva (CH) - Grenoble (FR)
    Posts
    253
    Answers
    11
    Vote Rating
    15
    siebmanb will become famous soon enough

      0  

    Default


    Thanks a lot.

    I changed my layout a bit, works fine now. Here is the new layout :

    Code:
    app.views.MyView = Ext.extend(Ext.Panel, {
        scroll: 'vertical',
        height: '100%',
    
    
        items: [{
            items: [{
                xtype: 'dataview',
            },
            {
                xtype: 'button',
            }]
        }]
    });

Thread Participants: 2

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi