Question

我有一个包含少量文件和提交按钮的表单...当我点击提交按钮时，表单应该验证并向我发送错误数据的错误但是发生的是，它发布数据而不是验证形式

如何验证表单然后发布表单？

    <body>
     <form class="cmxform" id="commentForm" method="post" action="">
     <div class="subColumns paragraph">
            <div class="lefty">
                <div class="fontWeight7">  
                    <label for="first_name">
                    First Name:</label>
                    <input id="first_name" class="text required" maxlength="200" 
                        name="first_name"   />
                </div>
            </div>
            <div class="cdc-left">
                <div class="fontWeight7">
                    <label for="last_initial">
                    Last Initial:</label>
                    <input id="last_initial" class="required text" maxlength="200" 
                        name="last_initial"  />
                </div>
            </div>
        </div>
            <input id="btnRegister" name="btnRegister" class="submit" type="submit" value="Submit Your Answer" /> 
</form>




 <script type="text/javascript">

    $(document).ready(function () {

        $("#commentForm").validate(); 

        // validate the comment form when it is submitted  
        // validate signup form on keyup and submit
        $("#signupForm").validate({
            rules: {
                firstname: "required",
                lastname: "required",
                username: {
                    required: true,
                    minlength: 2
                },
                password: {
                    required: true,
                    minlength: 5
                },
                confirm_password: {
                    required: true,
                    minlength: 5,
                    equalTo: "#password"
                },
                email: {
                    required: true,
                    email: true
                },
                topic: {
                    required: "#newsletter:checked",
                    minlength: 2
                },
                agree: "required"
            },
            messages: {
                firstname: "Please enter your firstname",
                lastname: "Please enter your lastname",
                username: {
                    required: "Please enter a username",
                    minlength: "Your username must consist of at least 2 characters"
                },
                password: {
                    required: "Please provide a password",
                    minlength: "Your password must be at least 5 characters long"
                },
                confirm_password: {
                    required: "Please provide a password",
                    minlength: "Your password must be at least 5 characters long",
                    equalTo: "Please enter the same password as above"
                },
                email: "Please enter a valid email address",
                agree: "Please accept our policy"
            }
        }); 

        $("#commentForm").validate({
            submitHandler: PostData
        });  

    });

    function PostData() {
  debugger
    var _firstName = commentForm.first_name.value;// $('#first_name').value; //first_name.value;
    var _lastName = $('#last_initial').value; //last_initial.value;
    var _city = $('#city').value; //city.value;
    var _state = $('#state').value; //state.value;
    var _country = $('#country').value; //country.value;

     } 

</script>

Answer 1

您正在按下按钮上的click事件，该事件发生在表单上的submit事件之前，而不是submitHandler callback option用于.validate()，就像这样：

$("#commentForm").validate({
  submitHandler: PostData
});

...并完全删除此click处理程序：

$('#btnRegister').click(function () {
  PostData();
});

submitHandler仅在验证成功时执行，这将是您想要的。

Answer 2

为什么不使用ASP.NET的验证控件进行服务器端验证？它具有更难覆盖的优点，因为如果用户将其浏览器配置为不运行JavaScript，则可以禁用客户端验证。

验证表格然后发布？

2 个答案: