フォームが送信され、検証が無視されるのはなぜですか？

Question

私はなぜjquery validationが私のフォームが提出されるのを止めないのか理解しようとしていますか？送信ボタンを押すと、フォームは正しくポストされますが、入力フィールドが空白のままであっても、検証エラー（このフィールドは必須）は無視されるようです。

フォーム

$(document).ready(function() { 
 
    $("#message").hide(); 
 

 
    //Define your validation rules. 
 
    $(function() { 
 
    $("#myform").validate({ 
 

 
    }); 
 
    $("#submitButtonId").on("click", function(e) { 
 
     var formdata = $("#myform").serialize(); 
 
     //Post form data 
 
     $.post('php_includes/simple_insert.php', formdata, function(data) { 
 
     //Process post response 
 
     $("#message").html(data); 
 
     $("#message").fadeIn(500); 
 
     $("#message").fadeOut(500); 
 
     }); 
 

 
     //Reset Form 
 
     $('#myform')[0].reset(); 
 
    }); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 

 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.15.0/jquery.validate.min.js"></script> 
 

 
<form class="form-inline" action="" id="myform" method="post"> 
 

 
    <!-- Text input--> 
 
    <div class="form-group"> 
 
    <label class="col-md-4 control-label" for="bill_cost"></label> 
 
    <div class="col-md-8"> 
 
     <input id="bill_cost" name="bill_cost" type="text" placeholder="Bill Cost" class="form-control input-lg" required> 
 

 
    </div> 
 
    </div> 
 

 
    <!-- Button --> 
 
    <div class="form-group"> 
 
    <label class="col-md-4 control-label" for="submit1"></label> 
 
    <div class="col-md-4"> 
 
     <button type="submit" id="submitButtonId" name="submit1" class="btn btn-primary btn-xl">Submit</button> 
 
    </div> 
 
    </div> 
 
</form>

Answer 1

有効なフォームの他の事をするsubmitHandlerを使用し、これを試してみてください：

$("#myform").validate({ 
     submitHandler : function() { 
      var formdata = $("#myform").serialize(); 
      //Post form data 
      $.post('php_includes/simple_insert.php', formdata, function(data){ 
      //Process post response 
      $("#message").html(data); 
      $("#message").fadeIn(500); 
      $("#message").fadeOut(500); 
      }); 

      //Reset Form 
      $('#myform')[0].reset(); 

      } 
     }); 

Answer 2

法案コストのテキストで必要タグを削除チェックボックスは無視されます。