Question

我正在使用表单验证程序plugin来验证表单。

如果我没有使用jQuery post方法提交数据，它正常工作。在使用jQuery帖子时，它不会在提交时验证表单。

我的代码是

<form action="UpdatedProfile" method="post" name="updateprofile" id="UpdatedProfile" class="form-horizontal">
<div class=" form-group ">
          <div class="col-lg-2">
                <label>First Name</label>
          </div>
          <div class="col-lg-4">
              <input type="text" name="fname" cssClass="form-control" data-validation="required" data-validation-error-msg="First Name is required"/>
        </div>
    </div>
   </form>

<script>
            $(document).ready(function () {
                $.validate();
                $(document).on('click', '#submit', function (event) {
                    event.preventDefault();
                    console.log($('#UpdatedBasicProfile').serialize());
                    $.post("Updated", $('#UpdatedProfile').serialize(), function (data)
                   {....});
          });
         });
  </script>

如何实现这一目标？

Answer 1

在表单中放置一个提交按钮，并在js中定义验证规则，如

$('#frm_registration').validate({
    rules:
    {
        fname: required
    },
    messages:
    {
        fname : 'Please enter name'
    }
});

或者如果按钮是按钮类型，则启动对其点击的验证，如：

$('#btn').click(function(){
    $('#frm_registration').valid();     // will initiate the validation
})

Answer 2

如果在点击提交按钮时验证器正在工作，您可以触发按钮上的点击事件，而不是听取文档的任何点击，如果目标是给定按钮。

在ajax post（）上使用jQuery Form Validator验证表单

2 个答案: