Results 1 to 3 of 3

Thread: Grid won't display vertical scrollbar

  1. #1
    Sencha User
    Join Date
    Sep 2016
    Posts
    10

    Default Answered: Grid won't display vertical scrollbar

    I've been reading around and have seen many other similar posts, but I'm still not getting it.

    I have a gridpanel on a window, and there are no horizontal scrollbars. Everything I've read says the containing panel needs to have 'layout: fit', and I tried that in my fiddle, but it still doesn't work. Please take a look at the fiddle and tell me what I'm missing.

    https://fiddle.sencha.com/#view/editor&fiddle/2l45

    Here's the code if that's easier to look at:

    Code:
            var mygrid = new Ext.grid.GridPanel({
                id: 'searchUsers-grid',
                margin: 10,
                autoScroll: true,
                store: mystore,
                columns: [
                        {
                            text: 'login',
                            flex: 1,
                            sortable: true,
                            dataIndex: 'userLogin'
                        }, {
                            text: 'fname',
                            flex: 1,
                            sortable: true,
                            dataIndex: 'firstName'
                        }, {
                            text: 'lname',
                            flex: 1,
                            sortable: true,
                            dataIndex: 'lastName'
                        }
                    ]
            });
    
    
            // Create the modal window
            Ext.define('Admin.SearchADUsers', {
                extend: 'Ext.window.Window',
                id: 'searchADUsers',
                alias: 'widget.SearchADUsers',
                autoShow: true,
                width: 350,
                height: 300,
                closable:false,
                draggable:false,
                resizable:false,
                modal: true,
                initComponent: function () {
                    var me = this;
                    Ext.applyIf(me, {
                        title: "search ad",
                        layout: 'fit',
    
    
                        items: [{
                                xtype: 'panel',
                                /*layout: {
                                    type: 'vbox',
                                    align: 'stretch'
                                },*/
                                layout: 'fit',
                                items: [mygrid]
                            }]
                    });
                    me.callParent(arguments);
                }
            });

  2. Hi,

    I think you need to add layout for window in config not in initComponent.
    Then it should works.

    Ext.define('Admin.SearchADUsers', {
    extend: 'Ext.window.Window',
    id: 'searchADUsers',
    alias: 'widget.SearchADUsers',
    autoShow: true,
    width: 350,
    height: 300,
    closable:false,
    draggable:false,
    resizable:false,
    layout: 'fit',
    modal: true,
    initComponent: function () {
    var me = this;
    Ext.applyIf(me, {
    title: "search ad",
    // layout: 'fit',


    items: [{
    xtype: 'panel',
    /*layout: {
    type: 'vbox',
    align: 'stretch'
    },*/
    layout: 'fit',
    items: [mygrid]
    }]
    });
    me.callParent(arguments);
    }
    });

  3. #2
    Sencha User
    Join Date
    Sep 2018
    Posts
    2
    Answers
    1

    Default

    Hi,

    I think you need to add layout for window in config not in initComponent.
    Then it should works.

    Ext.define('Admin.SearchADUsers', {
    extend: 'Ext.window.Window',
    id: 'searchADUsers',
    alias: 'widget.SearchADUsers',
    autoShow: true,
    width: 350,
    height: 300,
    closable:false,
    draggable:false,
    resizable:false,
    layout: 'fit',
    modal: true,
    initComponent: function () {
    var me = this;
    Ext.applyIf(me, {
    title: "search ad",
    // layout: 'fit',


    items: [{
    xtype: 'panel',
    /*layout: {
    type: 'vbox',
    align: 'stretch'
    },*/
    layout: 'fit',
    items: [mygrid]
    }]
    });
    me.callParent(arguments);
    }
    });

  4. #3
    Sencha User
    Join Date
    Sep 2016
    Posts
    10

    Default

    Wow. That worked. I don't fully understand why...guess I need to read up on it! Thank you so much for the help!

Similar Threads

  1. Replies: 1
    Last Post: 11 Apr 2016, 3:40 PM
  2. Grid without vertical scrollbar
    By nikolay.bobrovskiy in forum Ext 5: Q&A
    Replies: 1
    Last Post: 1 Oct 2014, 10:47 AM
  3. vertical scrollbar in grid causing horizontal scrollbar
    By jeremym in forum Sencha Ext JS Q&A
    Replies: 8
    Last Post: 12 Feb 2014, 12:57 PM
  4. Replies: 3
    Last Post: 21 Sep 2011, 11:41 PM
  5. help:why can't my gridpanel display vertical scrollbar ?
    By siriuswinds in forum Ext 2.x: Help & Discussion
    Replies: 6
    Last Post: 4 Jan 2008, 5:55 AM

Tags for this Thread

Posting Permissions

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