Hybrid View

  1. #1
    Sencha Premium Member
    Join Date
    Sep 2009
    Posts
    101
    Vote Rating
    1
    EZboy is on a distinguished road

      0  

    Default [4.1.0b2]BUG Ext.tree.Panel overflowX and overflowY have no effect

    [4.1.0b2]BUG Ext.tree.Panel overflowX and overflowY have no effect


    Hi,

    overflowX/overflowY do not work in the tree.Panel.

    How to reproduce: Just add "overflowY:'hidden'" to a tree.

    Modified two tree example:

    Code:
    Ext.require(['*']);
    
    Ext.onReady(function(){
        var store = Ext.create('Ext.data.TreeStore', {
            proxy: {
                type: 'ajax',
                url: 'get-nodes.php'
            },
            root: {
                text: 'Ext JS',
                id: 'src',
                expanded: true
            },
            folderSort: true,
            sorters: [{
                property: 'text',
                direction: 'ASC'
            }]
        });
    
        var tree = Ext.create('Ext.tree.Panel', {
            id: 'tree',
            store: store,
            width: 250,
            height: 300,
            overflowY:'hidden',
            viewConfig: {
                plugins: {
                    ptype: 'treeviewdragdrop',
                    appendOnly: true
                }
            },
            renderTo: document.body
        });
    
        var store2 = Ext.create('Ext.data.TreeStore', {
            proxy: {
                type: 'ajax',
                url: 'get-nodes.php'
            },
            root: {
                text: 'Custom Ext JS',
                id: 'src',
                expanded: true,
                children: []
            },
            folderSort: true,
            sorters: [{
                property: 'text',
                direction: 'ASC'
            }]
        });
    
        var tree2 = Ext.create('Ext.tree.Panel', {
            id: 'tree2',
            width: 250,
            height: 300,
            overflowY:'hidden',
            store: store2,
            viewConfig: {
                plugins: {
                    ptype: 'treeviewdragdrop',
                    appendOnly: true
                }
            },
            renderTo: document.body
        });
    });

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,069
    Vote Rating
    852
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Have you inspected the tree-body element? It has overflow-y : hidden.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha Premium Member
    Join Date
    Sep 2009
    Posts
    101
    Vote Rating
    1
    EZboy is on a distinguished road

      0  

    Default


    Shouldn't that prevent vertical scrollbar to appear(scrollbar is still there)? Or am i missing something?

  4. #4
    Sencha User
    Join Date
    May 2012
    Location
    London, UK
    Posts
    4
    Vote Rating
    0
    yvonatron is on a distinguished road

      0  

    Default overflowX:'hidden' & overflowY:'hidden do not hide scrollbars for iFrame on IE8/ FFox

    overflowX:'hidden' & overflowY:'hidden do not hide scrollbars for iFrame on IE8/ FFox


    Scroll bars are showing up for components that are exactly the right size and and should not see scroll bars e.g. a banner add and adding the following params does not force them away as they should. Need workaround for IE and Firefox. Chrome ok. Note that overflowX:'auto', did not work either.

    Thank you.


    overflowX:'hidden',
    overflowY:'hidden',
    autoScroll: false,

    partial code snippet
    note that xtype: "uxiframe", is of type iFrame

    bodyPadding: '0 0 10 0',
    items: [{
    xtype: 'container',
    height: '100%',
    layout: {
    type: 'vbox',
    //pack: 'justify',
    overflowX:'hidden'
    },
    width: 615,
    padding: '10 0 0 10',
    items: [{
    xtype: "uxiframe",
    name: 'banner',
    margin: '0 0 20 0',
    width: '100%',
    height: 207,
    overflowX:'hidden',
    overflowY:'hidden',
    autoScroll: false,
    flex:1
    },
    ........

Thread Participants: 2