[4.0.7] No vertical scrollbar in Grid. viewready event being called prematurely

[gordonk66]

I'm seeing an issue on one grid in my application across all browsers. The base problem is the vertical scrollbar is not enabled for the grid. I traced the reason for no scrollbar down to two issues both in Ext.panel.Table.

1. The gird view ready event is being called prior to the table child of the view.el being created. This is a problem b/c the determineScrollbars function relies on it being there in order to determine if there should be a vert scrollbar. So to lay it out the onViewReady function calls the determineScrollbars function where does the following to determine the height of the vertical scroller:

            // Calculate the height of the scrolling block
           // gordonk66 - my verticalScroller.el is undefined.  I verified this is true on other functioning grids on initial load as well
            if (verticalScroller && verticalScroller.el) {
                scrollHeight = verticalScroller.getSizeCalculation().height;
            } else {
                // gordonk66 - child function returns undefined
                tableEl = view.el.child('table', true);
                scrollHeight = tableEl ? tableEl.offsetHeight : 0;
            }

My workaround for this (which I hate) is to override the onViewReady function in the grid having the problem and add a defer for waiting until the view child call to table is not undefined:

    onViewReady: function() {
        if (this.deferRowRender) {
            // here we need to wait until the view el is rendered and then set the height equal to the body height
            var view = this.getView();
            // If the view dom exists we are ready to process.
            if (view.el.child('table', true) !== undefined) {
                this.fireEvent('viewready', me);
                this.determineScrollbars();
                this.invalidateScroller();
            } else {
                // If the view body does not exist queue this function to execute again in .1 seconds.
                Ext.defer(this.onViewReady, 100, this);
            }
        } else {
            // If deferRowRender is false just fire the viewready event.
            this.fireEvent('viewready', me);
        }
    }

Ok so this got me into problem number two which is the clientHeight being used in determineScrollbars which is pulled from view.el.getSize() is not equal to the size of the panel height. Instead it is equal to the tableEl.offsetHeight found above which also results in no vertical scrollbar. I got around this by altering onViewReady further to change the height of the view.el to match the body of the grid panel.

Final work around:

    onViewReady: function() {
        if (this.deferRowRender) {
            // here we need to wait until the view el is rendered and then set the height equal to the body height
            var height = this.body.getHeight();
            var view = this.getView();
            // If the view dom exists we are ready to process.
            if (view.el.child('table', true) !== undefined) {
                // Alter the height of the view to match that of the panel body.
                view.el.setHeight(height);
                this.fireEvent('viewready', me);
                this.determineScrollbars();
                this.invalidateScroller();
            } else {
                // If the view body does not exist queue this function to execute again in .1 seconds.
                Ext.defer(this.onViewReady, 100, this);
            }
        } else {
            // If deferRowRender is false just fire the viewready event.
            this.fireEvent('viewready', me);
        }
    }

Other details:
This only happens when a horizontal scrollbar is not present. If the columns of the grid are shorter then the width of the grid panel this issue appears.
I didn't open a bug report on this b/c I have no clear testcase for reproducing it. I only see it on a single grid in my app. The grid is hidden when the app initially loads and has quite a bit of complexity around it (renderers, paging toolbar, etc).

[mitchellsimoens]

The scrolling should be fixed in 4.1 as the native scrolling is back.

[gordonk66]

Thanks Mitch.
I suppose there's no word on when 4.1 will be available?

[mitchellsimoens]

Thanks Mitch.
I suppose there's no word on when 4.1 will be available?

Preview has been out...

http://www.sencha.com/blog/ext-js-4-...loper-preview/