bootstrap form validation jquery code example

Example 1: form validation javascript bootstrap

<script>
          // Example starter JavaScript for disabling form submissions if there are invalid fields
          (function() {
            'use strict';
            window.addEventListener('load', function() {
              // Fetch all the forms we want to apply custom Bootstrap validation styles to
              var forms = document.getElementsByClassName('needs-validation');
              // Loop over them and prevent submission
              var validation = Array.prototype.filter.call(forms, function(form) {
                form.addEventListener('submit', function(event) {
                  if (form.checkValidity() === false) {
                    event.preventDefault();
                    event.stopPropagation();
                  }
                  form.classList.add('was-validated');
                }, false);
              });
            }, false);
          })();
          </script>

Example 2: jquery form validation

function submitFunction(event){
	event.preventDefault();
}
$("#form_id").submit(submitFunction);

Example 3: bootstrap 4 form validator with jquery

$(document).ready(function() {
  $("#submitButton").click(function() {
    //Fetch form to apply custom Bootstrap validation
    var form = $("#signup-form");

    if (form[0].checkValidity() === false) {
      event.preventDefault();
      event.stopPropagation();
    }
    
    form.addClass('was-validated');

    //Make ajax call here
  })
})

Tags:

Css Example