Scroll event on ExtJS Grid Panel?

Question

I have a grid panel in ExtJS with scroll bars. I am trying to detect when the user has scrolled all the way down(so that they can not move bar anymore). So far I have this, which detects when scroll occurs but provides no information(?) about where the scroll bar is.

//bufferedGrid is a grid panel
this.randomGrid.getView().on('scroll', this.onRandomGridScroll, this);
.
.
.
onRandomGridScroll : function(e, t)
{
    console.log(e);
    console.log(t);

}

Any pointers would be appreciated.

Answer 1

You can access the current scroll bar position(actually, the top of the scroll bar) and the maximum scroll position as follows( works in Firefox but not Chrome ):

onBufferedGridScroll : function(e, t)
    {
        var max = this.bufferedGrid.getView().el.dom.scrollTopMax;
        var current = this.bufferedGrid.getView().el.dom.scrollTop;
        if( current == max )
            alert('You have reached the bottom of the scroll !');
    }

Answer 2

Add event on init After grid is rendered add a mouseup event and a wheel down event.

'container #gridId':{ afterrender: this.addScrollEventListener }

addScrollEventListener: function(comp){
    comp.getTargetEl().on('mouseup', function(e, t) {
        var height = comp.getTargetEl().getHeight();
        if (height + t.scrollTop >= t.scrollHeight) {

        }
    });
    comp.getTargetEl().on('wheeldown', function(e, t) {
        var height = comp.getTargetEl().getHeight();
        if (height + t.scrollTop >= t.scrollHeight) {

        }
    });
}