在ajax帖子上使用jQuery Form Validator驗證表單（）

Question

我正在使用表單驗證器插件來驗證我的表單。

如果我不使用jQuery post方法提交數據，它將正常工作。 在使用jQuery post時，它不會在提交時驗證表單。

我的代碼是

<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

如果單擊提交按鈕時驗證程序正在工作，則可以在按鈕上觸發單擊事件，而不是偵聽文檔中是否有任何單擊，並且目標是給定的按鈕。