Question

I have a dataTable and I am using scrollBar if the records exceed ,lets say 20. The problem is after post back the div scroll bar goes to top. Is there anyway I can fix the resetting of scroll of div after post back. Thanks.

Answer 1

You can get and set the element’s current scroll position in Javascript using element.scrollTop. Make use of the form’s onsubmit handler to save it as a hidden input element:

<h:form id="formId" onsubmit="saveScrollPos()">
    <h:inputHidden id="scrollPos" />
    ...

with this function

function saveScrollPos() {
    var scrollPos = document.getElementById('divId').scrollTop;
    document.getElementById('formId:scrollPos').value = scrollPos;
}

This way it’s available as request parameter with the name formId:scrollPos. You can use Javascript to set it during onload:

window.onload = function() {
    var scrollPos = <h:outputText value="#{param['formId:scrollPos']}" />;
    document.getElementById('divId').scrollTop = scrollPos;
}

Here the divId is obviously the ID of the <div> you’d like to scroll.