爲什麼我的表單提交併忽略驗證？

我想弄清楚爲什麼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>

來源

2016-04-30 JulianJ

「點擊提交按鈕」事件發生在*「提交表單」事件之前，並且它是具有驗證代碼的「提交表單」事件。由於您在「點擊提交按鈕」事件中發送了「發佈」請求，因此在此之前尚未進行驗證。 –

試試這個，使用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(); 

      } 
     });

來源

2016-04-30 10:14:30

該死的，你只是打我吧 –

這並不能解釋爲什麼OP的代碼不工作，雖然;） –

，因爲即使有驗證，他還沒有檢查表單是否有效發送阿賈克斯 - 作爲用戶點擊按鈕ajax只會執行，所以使用submitHandler我們可以檢查，如果有效，那麼只發送ajax請求 –

-1

票據成本的文字刪除要求標籤box.then你檢查驗證被忽略

來源

2016-04-30 10:21:59

爲什麼我的表單提交併忽略驗證？

回答

相關問題