Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Posted by ben pines
ben pines
8,389 Points

How can I create ajax form that submits to the same page?

in this treehouse blog post they explain how to build a form using ajax, but they submit the data to another file. How can I have a form that stays on the form page after the form is sent.

ben pines
ben pines
8,389 Points

http://blog.teamtreehouse.com/create-ajax-contact-form#comments

1 Answer

Andrew Kiernan
Andrew Kiernan
26,892 Points

Hi Ben:

Not sure if you still have questions on this, but using the method described in the blog post your browser will stay on the form page. The file you submit to processes the response and then sends back to the browser whether the submission was successful all without reloading the page.

The page is stopped from reloading by using the event.preventDefault() method, which stops the browser from doing what it would normally do in a given situation (in this case, submit the form and follow through to a form submitted page). So you stop the form submission, then submit it manually through an AJAX call, then process your server's response, and show the user the result of the submission.

Hope this helps.

-Andrew