Problem with $.get while submitting form

Question

I'm trying to verify that an Account Name is not already in use once a user fills out a form. The code looks like:

    $("#add_account").submit( function () { 
            $.get(
                "'.url::site("ajax/check_account_name").'", 
            {account_name: "t"}, 
            function(data){ 
                alert( data ); 
            }); 
        });

I get a $.get response if the statement sits like this:

    $(document).ready( function () { 
            $.get(
                "'.url::site("ajax/check_account_name").'", 
            {account_name: "t"}, 
            function(data){ 
                alert( data ); 
            }); 
        });

Which leads me to believe that my $.get statement is correct. Is there some jQuery rule I'm not familiar with that would cause this to fail in on submit scenario?

In code block 1, I get values returned like they should. Block 2 gives me a blank response.

Any ideas? Thanks for your time, I know you have better things to be doing.

Answer 1

Javascript handlers fire before the default action of whatever it is you clicked on. So, if you have this $.get statement attached to the submit button of a form, then the $.get statement will fire before submitting the form via the browser methods.

To cancel this action, you should include return false; at the end of your click handler to cancel the default action, as J-P indicated. This works for links as well.