Question

I have a div that contains a table. This table is dynamically updated, and is filling up with data as user is using our website.
Is it possible to force this div to always be scrolled to bottom? So that the user will always be able to see the bottom most table row that was added.
Thank you!

Answer 1

That would be something like

...onRowAdded = function() {
    $('#myTable').animate({scrollTop: $('#myTable').attr('scrollHeight')});
};

Note, if the rows are added very often, you would want to use setTimeout with blocking variable check at the beginning to prevent scrolling down more often than twice per second or so. This technique is discussed e.g. here

UPDATE

Starting with jQuery 1.6 it is better to use .prop() instead of .attr() (see comments to this question):

onRowAdded = function() {
    $('#myTable').animate({scrollTop: $('#myTable').prop('scrollHeight')});
};