function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
bohemianguy100bohemianguy100 

commandButton click - jump to the top of the screen

I have implemented paging in one of my VF pages that displays a list of events.  When the user clicks on one of the paging buttons, it maintains the screen position instead of going to the top of the page for the next series of records that are displayed.  How can I get the commandButton to move to the top of the page when clicked so the user is at the top of the screen to see the next set of records pulled up from the paging?

 

Here are my buttons:

 

<apex:commandButton id="first" value="First" action="{!first}" />
<apex:commandButton id="prev" value="Prev" action="{!previous}" rendered="{!hasPrevious}" />  
<apex:commandButton id="last" value="Last" action="{!last}" />
<apex:commandButton id="next" value="Next" action="{!next}" rendered="{!hasNext}" />

 Thanks.

Best Answer chosen by Admin (Salesforce Developers) 
AnushaAnusha

You can add like this

 

<apex:commandButton value="First" oncomplete="window.scrollTo(0,0);"/>

 

oncomplete will invoke when the Button Action is Complete.

 

All Answers

tom_patrostom_patros

Use an actionStatus component tied to each button with a onstop() event, and some JS that scrolls to the top of the page. Something like:

 

<apex:actionStatus id="theStatus" onstop="window.scrollTo(0,0); return false;" />
<apex:commandButton status="theStatus" id="first" value="First" action="{!first}" />
<apex:commandButton status="theStatus" id="prev" value="Prev" action="{!previous}" rendered="{!hasPrevious}" />  
<apex:commandButton status="theStatus" id="last" value="Last" action="{!last}" />
<apex:commandButton status="theStatus" id="next" value="Next" action="{!next}" rendered="{!hasNext}" />

window.scrollTo() should do the job. If you are a jQuery fan, there's something equivalent in there too I'm sure.

AnushaAnusha

You can add like this

 

<apex:commandButton value="First" oncomplete="window.scrollTo(0,0);"/>

 

oncomplete will invoke when the Button Action is Complete.

 

This was selected as the best answer