RJS Move to top of div after Ajax request

Hi,

Im updating a scrollable div with many links_to_remote. If a user has
scrolled half way down the div and then clicks the link_to_remote
outside the div it then updates the scrollable div but stays half way
down. I want it to automatically go back to the top of the div.

The code is below for the link to remote, is this possible to do?

<%= link_to_remote “Update Div”,
:url => { :action => “load_questions”, :id => category},
:before => “Element.show(‘main_spinner’)”,
:success => “Element.hide(‘main_spinner’)” %>

Any help appreciated.

JB

John B. wrote:

Im updating a scrollable div with many links_to_remote. If a user has
scrolled half way down the div and then clicks the link_to_remote
outside the div it then updates the scrollable div but stays half way
down. I want it to automatically go back to the top of the div.

Perhaps you could do a javascript “focus” on an element at the top of
the div in question? I haven’t tried it, so no guarantees, but it may
work.

Similar to having for use with links that hop around
the page (common usage for FAQ pages), you could make an empty tag
with id=“top” and focus on it with javascript.

  • Aaron

Aaron Brown wrote:

John B. wrote:

Im updating a scrollable div with many links_to_remote. If a user has
scrolled half way down the div and then clicks the link_to_remote
outside the div it then updates the scrollable div but stays half way
down. I want it to automatically go back to the top of the div.

Perhaps you could do a javascript “focus” on an element at the top of
the div in question? I haven’t tried it, so no guarantees, but it may
work.

Similar to having for use with links that hop around
the page (common usage for FAQ pages), you could make an empty tag
with id=“top” and focus on it with javascript.

  • Aaron

Thanks for your help,

I created an invisible link at the top of the div and after i update the
scrollable div i call the code below at the end of the partial:

<%= javascript_tag render(:update) { |page| page[‘top’].focus } %>

JB