开发者

jQuery ajaxSubmit ignored by IE8

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:

<script src="/js/jquery.validate.min.js" type="text/javascript"></script>
<script src="/js/jquery.form.js" type="text/javascript"></script> 
<script type="text/javascript">
$(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 <b>valid</b> 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 (v开发者_C百科alidator.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;
    });
});
</script>

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!


Try the following:

$('#form_notify').submit(function(e) {
    e.preventDefault();
    if (validator.numberOfInvalids() == 0) {
        $(this).fadeOut('fast', function() {$('#thank-you').fadeIn();});
            return true;
    }
    return false;
});
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜