Detect scroll bar is at top bottom

Tried these without success
oGrid.getScrollTop() == oGrid.getScrollHeight() // false
oGrid.getPanelHeight() // 0
oGrid.getContentHeight() // 0

Beyond the solution, what is the rationale to find it?
Thierry Nivelet (http://FoxInCloud.com/)
July 21,
The size is calculated after the grid is written to the page, so you need some timeout before reading the size. You should use getScrollTop(), getScrollHeight() and getContentHeight("total") for the actual size of the full content area (header, rows, footer, scrollbars).

You may also look at /source/lib/grid/_overflow.js
Alex (ActiveWidgets)
July 27,
Here is an example -

obj.onScrollTopChanged = function(){

    var distanceToBottom = 1,
        scrollTop = this.getScrollTop(),
        scrollHeight = this.getScrollHeight(),
        scrollVisible = this.getScrollBars(),
        scrollBarHeight = (scrollVisible == 'horizontal' || scrollVisible == 'both') ? AW.sy : 0,
        contentHeight = this.getContentHeight('total');

    if (scrollHeight + scrollBarHeight - scrollTop - contentHeight <= distanceToBottom){
        console.log('end of scroll');
Alex (ActiveWidgets)
July 28,
Thanks Alex
Thierry Nivelet (FoxInCloud)
August 7,
Hi Alex,

The solution you suggested works fine when moving to the last row scrolls the rows down. However, if rows are already scrolled down to the max., moving between the last and the one-before-last row does not seem to trigger in the above code snippet
console.log('end of scroll');

Here is what I'm looking at: when first or last row is current, hitting the up or down arrow key triggers an event. On that event, we'll load the previous/next page in the grid.

Here is a public testable URL: http://foxincloud.com/tutotest/eventlog.tuto

this provides a reference to the aw grid object:
var obj = $('eventlog_scx-grd-grd').oGrid

here is a screenshot: ftp://foxincloud.com/Screenshots/FiC/aw.grid.lastRow.png

Thanks in advance,
Thierry Nivelet (FoxInCloud)
November 2,
In this case you should look at selection change and keyboard events, not scrolling. You can listen to onCurrentRowChanged event to find when the current row changes.

var index = grid.getCurrentRow();
var position = grid.getRowPosition(index);
var count = grid.getRowCount();

If position == 0 then you are at the first row. If position == count-1 then it is the last one. At this point you should also listen to keyboard events to get up/down keys.
Alex (ActiveWidgets)
November 9,
successfully implemented in:

grid paged on server side:
- when user attemps to move beyond the last row, the next page loads from the server automatically
- supports 'home' and 'bottom' keys
March 24,

This topic is archived.

See also:

Back to support forum