Warum sendet mein Formular die Validierung und ignoriert sie?

Question

Ich versuche herauszufinden, warum nicht verhindert, dass mein Formular übermittelt wird? Wenn der Submit-Button gedrückt wird, wird das Formular korrekt gepostet, scheint aber den Validierungsfehler zu ignorieren (Dieses Feld ist erforderlich), selbst wenn das Eingabefeld leer gelassen wird.

Die Form

$(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

diese

Versuchen, verwenden submitHandler andere Dinge für eine gültige Form zu tun:

$("#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

Entfernen eines Erforderliche Tag in Rechnung Kosten Text box.then Sie überprüfen, dass die Validierung ignoriert wird