Return true from .submit causes existing async ajax calls to fail
I have a submit handler similar to the code shown below. The gist of it, is that when submit is clicked, I want to do "something" and then use the form's post to redirect the user to a "thank you" page. When I return true, the existing ajax call fails, and the redirect occurs as normal. When I return false, the ajax call succeeds, but the redirect doesn't happen. Can someone explain why?
- jQuery(document).ready( function($) {
- var request;
- $("#my-form-id").submit( function( event ) {
- if( request ) request.abort();
- var $form = $(this);
- var serializedData = $form.serialize();
- request = $.ajax({
- url: "http://some-ajax-script",
- type: "post",
- data: serializedData
- });
- // set action attribute dynamically (anti-bots)
- url = "http://thank-you-page";
- $("#my-form-id").attr( 'action', url );
- return true;
- });
- });