Jquery验证第二次无法运行

时间:2015-01-22 08:05:55

标签: javascript jquery jquery-validate

问题是这个jquery验证第二次没有在我的表单中工作。它第一次工作完美,但第二次显示错误信息,但表格将提交。代码在这里

 (function ($, W, D) {
        var JQUERY4U = {};

        JQUERY4U.UTIL =
        {
            setupFormValidation: function () {
                //form validation rules
                $("#aspnetForm").validate({
                    rules: {
                        firstname: "required",
                        lastname: "required",
                        company: "required",
                        jobtitle: {
                            required: true,
                        },
                        phone: {
                            required: true,
                            number: true
                        },
                        email: {
                            required: true,
                            email: true
                        },

                    },
                    messages: {
                        firstname: "Please enter your first name",
                        lastname: "Please enter your last name",
                        company: "Please enter your company name",
                        jobtitle: "Please enter your job title",
                        phone: "Please enter a valid phone number",

                        email: "Please enter a valid email address",
                    },
                    submitHandler: function (form) {

                        $('#aspnetForm').on('submit', function (e) {
                            e.preventDefault();
                            if (flag) {
                                createListItem();
                            }
                        });

                        //form.submit(function (e) {
                        //    e.preventDefault();
                        //    if (flag) {
                        //        createListItem();
                        //    }
                        //});


                    }
                });
            }
        }

        //when the dom has loaded setup form validation rules
        $(D).ready(function ($) {
            JQUERY4U.UTIL.setupFormValidation();
            $('#newsletterModal').on('hidden.bs.modal', '.modal', function () {
                clearFields();
            });
            $('#newsletterModal').on('shown.bs.modal', function (e) {
                $('#lblMsg').empty();
            });
        });

    })(jQuery, window, document);

任何人都可以帮助我

1 个答案:

答案 0 :(得分:1)

您的submitHandler回调功能......

submitHandler: function (form) {
    $('#aspnetForm').on('submit', function (e) {
        e.preventDefault();
        if (flag) {
            createListItem();
        }
    });
}

请勿在{{1​​}}回调中添加submit个事件处理程序!我不清楚您尝试做什么,但<插件的em> the submitHandler回调函数已经捕获了&amp;替换了形式的默认提交事件。

此外,每当您声明自己的submitHandler函数时,您都会超越插件中内置的默认值。由于我在提交表单的自定义submitHandler内部看不到任何内容,因此永远不会提交表单。

您需要删除submitHandler以允许根据默认功能提交表单(有效时)或者您需要将submitHandler置于其中它在某个地方。

$(form).submit()

注意

包装这样的一切都是多余的,不必要的,冗长的,神秘的......

submitHandler: function (form) {
    if (flag) {
        createListItem();
    }
    $(form).submit();
}

除了给寻求指导的人带来更多混淆之外,它没有用处。 它来自一个流行但却很难解释的online demo/tutorial by Sam Deering,与许多地方相关联。

上面的整个混乱可以通过将(function($,W,D) { var JQUERY4U = {}; JQUERY4U.UTIL = { setupFormValidation: function() { $("#aspnetForm").validate({ .... }); } } $(D).ready(function($) { JQUERY4U.UTIL.setupFormValidation(); }); })(jQuery, window, document); 方法放在DOM ready事件处理函数中来删除并简单替换...

.validate()