【问题标题】:jquery form validation lets submitting form even with errorsjquery 表单验证允许提交表单,即使有错误
【发布时间】:2018-04-01 21:43:16
【问题描述】:

使用 jquery 验证插件,如果我第一次提交表单时出现错误,那么它将不允许表单提交并显示错误。但是,如果我只是修复了一个表单元素错误而让其他元素仍然无效,则表单将提交到表单操作 URL。

除非用户已修复所有错误,否则我希望表单不提交。我试图在 submithandler 中返回 false,但徒劳无功。

jQuery(function ($) {
    $('#regform').validate({
        rules: {
            fullname: {
                required: true,
                minlength: 2,
                maxlength: 20,
                lettersonly: true
            },
            gender: {
                required: true
            },
            mobile: {
                required: true,
                minlength: 10,
                maxlength: 13,
                digits: true
            },
            address: {
                required: true,
                minlength: 10,
            },
            email: {
                required: true,
                email: true
            },
            password: {
                required: true,
                minlength: 6

            }
        },
        messages: {
            fullname: {
                required: "Please enter your full name",
                minlength: "Name should be more than 2 characters",
                maxlength: "Name should be less than 20 characters",
                lettersonly: "Name should contain only letters"
            },
            gender: {
                required: "Please select your gender",
            },
            mobile: {
                required: "Please enter your mobile number",
                minlength: "Mobile number should be more than 10 characters",
                maxlength: "Mobile number should be less than 13 characters",
                digits: "Mobile number should contain only digits"
            },
            address: {
                required: "Please enter your address",
                minlength: "Address should be more than 10 characters",
            },
            email: {
                required: "Please enter your email address",
                email: "Please enter a valid email address"
            },
            password: {
                required: "Please provide a password",
                minlength: "password must be at least 6 characters"
            }
        },
        submitHandler: function(form) {
            var valid = $("regform").valid();
            if(!valid) {
                e.preventDefault();
                alert("stop");
            } else {
                e.preventDefault();
            }

        }
    });
});

【问题讨论】:

    标签: jquery forms validation


    【解决方案1】:

    使用与您类似的设置,但字段较少-https://codepen.io/jefftimbre/pen/xWjQrX?editors=1010

    lettersonly 方法可能已被删除或弃用。将以下内容添加到您的代码中,它应该可以工作。让我知道。

    $.validator.addMethod( "lettersonly", function( value, element ) {
        return this.optional( element ) || /^[a-z]+$/i.test( value );
    }, "Letters only please" );
    

    【讨论】:

      【解决方案2】:

      您是否尝试在 submithandler 中将 var valid = $("regform").valid(); 修改为
      var valid = $("#regform").valid();

      让我知道修改后的情况。我可以帮你进一步调查这个问题。

      【讨论】:

      • 它没有任何区别。第一次它会阻止表单提交,但之后您可以提交表单。
      • 我使用了与您相同的设置,但 codepen.io/jefftimbre/pen/xWjQrX?editors=1010 上的字段较少,这对我有用,在所有字段都得到验证之前表单不会提交。让 mw 知道。
      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2019-12-01
      • 1970-01-01
      • 2017-08-15
      • 1970-01-01
      • 2013-08-17
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多