How to prevent page from scrolling up after submit

On this test page, if you click the contact link, then submit, the page jumps to the top… i guess that page is refreshing?? How can I prevent this jump to the top and have the page stay still?

When you submit a form, the page is dismissed and if no URL is specified in the action parameter, the page reloads. If you want to regain the scrolled position on reload, you could use a script like]( , but the fields will be empty unless you use ideally server-side code to restore their content.

So does that mean when I the php handling the form data correctly the page will not reload or scroll up?

Normally when you submit a form it goes to whatever page is specified in <form action=“page.php”> and sends the POST data to that page. Since you have no action it’s refreshing the current page and sending the form data to that. What do you want to happen? You don’t want the page to refresh? Or you want it to refresh but go back to the contact form? If you don’t want to have a page refresh on a form submit, you need to submit it with an AJAX solution. If you just want the page to refresh and go back to the contact form, you could make the action self.php#contact, or have the form processing page redirect back to self.php#contact. If you have an anchor on the page named contact it will jump to it when the page is done loading.

The page will eventually have a php handling URL in the action attribute. Refresh or not, I want the page to stay put. In other words, after clicking submit you can still see the form. So I need an ajax solution to do this?

That is correct.

Bulletproof Ajax is the best books about how to easily do this.

He even provides the code and demos, giving you just what you need whether you have the book or not.

Thanks for the links. Looks like a book I should read. I don’t know anything about ajax, so for the code examples I would just be guessing at what I need.

I gather that just by submitting a form with ajax the page won’t refresh so maybe there are tutorials online to cover this…

The online tutorials are nowhere as good. Go to your local library and see if they have Bulletproof Ajax there. There are also places like rapidshare for if you’re feeling particularly naughty about things.