views:

32

answers:

3

I am submitting a page onclick of a form element and need a function to run after the submit refreshes the page. I'm trying to add an animated scroll back to the clicked element that caused the submission. I've got the scroll part covered but I can seem to figure out how to cause the function I wrote for the scroll to run after the page refreshes from the submit.

Any timely help would be much appreciated!

A: 

If you do a "real" form submit, where the actual page refreshes, there is no way you can do it from the client (except using frames). Once you leave the page, your javascript is out of scope. You need to insert the javascript to the refreshed page on the server.

If, on the other hand, you are submitting the form and refreshing a part of the page via ajax, then, depending on the framework you use, you'll be looking for a callback hook like onSuccess etc. in your ajax submit function

seanizer
Thanks for the help! Seems like this block of code will need to be updated to AJAX.
designerdre101
+1  A: 

If you are doing a full submit, rather than an AJAX submit, then the page that displays afterwards is not the same page as the one that the form was submitted from. Consequently, the identity of the clicked element will not be available on the second page.

What you need to do is, during the submit handler, store the identity of the clicked element (Should probably be a unique ID of some kind) in a hidden field of the form.

When the page refreshes, it should now have the unique ID available (Probably placed in the same hidden field of the form by the server side code) and a javascript function can read this value to control the scrolling.

Does this make sense?

If you update your question to include some sample code, then I might be able to clarify further.

belugabob
Thanks! This clears some things up for me. Also the hidden field idea is a good one but since the page is being submitted or essentially refreshed, would that value just be reset after the refresh?
designerdre101
The value of the hidden field is set in two places. The first place that, is on the client side, and this is done to ensure that the pertinent information is included in the post. (i.e. which element was clicked) The second place is on the server side, and this is used to convey the identity of the clicked element to the response page, so that the client side code can scroll to it. (Server side would probably initially set the hidden field to a value (such as an empty string, or zero) that indicates no element was clicked and that no scrolling is necessary.
belugabob
A: 

This would be easier to do in ajax however if you need to do it as a postback then you need to attach an event to the body load event and send some data back with the postback that would identify that the page has loaded as part of a post back and not a new page load.

e.g. create a hidden contol ont he web page and on the postback give it a value , on the postback check to see if that hidden control has a value and if so run your scorll code.

Alex
Thanks! AJAX here i come
designerdre101