Jquery 第二次验证无效

Question

问题是这个 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);

谁能帮帮我

Answer 1

你的 submitHandler 回调函数...

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

不要在 submitHandler 回调中放置 submit 事件处理程序！ 我不清楚你要做什么，但是 the submitHandler 插件的回调函数已经捕获并替换了表单的默认提交事件.

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

您需要删除 submitHandler 以允许按照默认功能提交表单（有效时），或者您需要将 $(form).submit() 放在其中的某个地方.

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

注意:

像这样总结一切都是多余的、不必要的、冗长的和神秘的...

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

    JQUERY4U.UTIL =
    {
        setupFormValidation: function() {
            $("#aspnetForm").validate({ .... });
        }
    }

    $(D).ready(function($) {
        JQUERY4U.UTIL.setupFormValidation();
    });

})(jQuery, window, document);

除了给那些寻求指导的人造成更多混乱之外，它没有任何用处。 它来自一个流行但解释不多的 online demo/tutorial by Sam Deering，链接 to/from 很多地方。

可以删除上面的整个混乱，只需将 .validate() 方法放在 DOM 就绪事件处理函数中...

$(document).ready(function() {

    $("#aspnetForm").validate({ .... });

});

Jquery 第二次验证无效

Jquery validation not working second time

javascript

jquery

jquery-validate