PDA

View Full Version : How to listen to a gridpanel scroll bar



Yemi
7 Aug 2013, 8:40 AM
I have a grid embedded in a panel with a scrollbar attached to this grid, are they any event listener that can be used to track when the scroll bar reaches the end of the grid ?

willigogs
7 Aug 2013, 8:48 AM
I would attach a listener to the element's scroll event, then interrogate the scroll position compared to the element height...

http://docs.sencha.com/extjs/3.4.0/#!/api/Ext.Element-event-scroll

Yemi
7 Aug 2013, 9:04 AM
can you give a simple example using a gridpanel, I did not fully understand what you said.

Thanks

willigogs
7 Aug 2013, 9:47 AM
An example:

var grid = {
xtype: 'grid',
listeners: {
bodyScroll: function(scrollLeft, scrollTop) {
var el = this.getEl();
var scroller = el.child('.x-grid3-scroller')
var insider = scroller.child('.x-grid3-body')
if(insider.getHeight() == scrollTop + scroller.getHeight()) {
console.log('You have reached the bottom')
}
}
}
};

Yemi
11 Aug 2013, 11:52 PM
Thanks, just what I needed

Yemi
12 Aug 2013, 9:06 AM
Hello,

What if am planning to offset the value by 20px; I dont want the scrollbar to reach the bottom. using
insider.getHeight()-20 did not work, any suggestion on how to do that.

Thanks

Yemi
14 Aug 2013, 3:46 AM
anyone with a suggestion ?

willigogs
14 Aug 2013, 7:01 AM
Have you tried debugging the issue by console.log'ing the values?

If you do, I'm sure you will see the problem...