jQuery ajaxSubmit ignored by IE8

Posted by George Burrell on Stack Overflow See other posts from Stack Overflow or by George Burrell
Published on 2011-01-06T16:50:42Z Indexed on 2011/01/06 16:53 UTC
Read the original article Hit count: 345

Hi there,

I am combing the jQuery validation plug-in with the jQuery Form Plugin to submit the form via AJAX. This works perfectly in Firefox & Chrome, but (as usual) Internet Explorer is being a pain. For reasons that are alluding me, IE is ignoring the ajaxSubmit, as a result it submits the form in the normal fashion.

I've followed the validation plug-in's documentation when constructing my code:

JS: $(document).ready(function() { var validator = $("#form_notify").validate({ messages: { email: { required: 'Please insert your email address. Without your email address we will not be able to contact you!', email:'Please enter a valid email address. Without a valid email address we will not be able to contact you!' } }, errorLabelContainer: "#error", success: "valid", submitHandler: function(form) {$(form).ajaxSubmit();} }); $('#email').blur(function() { if (validator.numberOfInvalids() > 0) { $("#label").addClass("label_error"); return false; } else {$("#label").removeClass("label_error");} }); $('#form_notify').submit(function() { if (validator.numberOfInvalids() == 0) { $(this).fadeOut('fast', function() {$('#thank-you').fadeIn();}); return true; } return false; }); });

Form HTML:

<form id="form_notify" class="cmxform" name="form_notify" action="optin.pl" method="get">
                                <fieldset>
                                    <div class="input">
                                        <label id="label" for="email">Email Address:</label>
                                        <input type="text" id="email" name="email" value="" title="email address" class="{required:true, email:true}"/>
                                        <div class="clearfix"></div>
                                    </div>
                                    <input type="hidden" name="key" value="sub-745-9.224;1.0.0.0.0.0.0.0.0.0.0.0.0.0.0.0;;subscribe-224.htm">
                                    <input type="hidden" name="followup" value="19"> 
                                    <input type="submit" name="submit" id="submit-button" value="Notify Me">
                                    <div id="error"></div>
                                </fieldset>
                            </form>

I can't understand what is causing IE to act differently, any assistance would be greatly appreciated.

I can provide more information if needed.

Thanks in advance!

© Stack Overflow or respective owner

Related posts about AJAX

Related posts about jquery-plugins