jQuery-validate Example

HTML

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.0/jquery.validate.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.0/additional-methods.js"></script>
<form id="myForm" action="#" autocomplete="false" method="POST" class="">
  <div class="form-group">
    <input type="text" name="email" class="form-control" placeholder="Email" required>
  </div>
  <div class="form-group">
    <input type="password" name="password" class="form-control" placeholder="Password" required>
  </div>
  <div class="form-group">
    <input type="submit" class="btn btn-primary" />
  </div>
</form>

<br />
<br />
<br />

<button id="validateForm">
  Validate Form
</button>

CSS

body {
  padding: 20px;
}

label {
  display: block;
}

input.error {
  border: 1px solid red;
}

label.error {
  font-weight: normal;
  color: red;
}

button {
  display: block;
  margin-top: 20px;
}

JavaScript

$(document).ready(function() {
  $('#myForm').validate({
  rules:{
      email: {
        required: true,
        email: true
      },
      password: {
        required: true,
        minlength: 5
      }
    }
  });

  $('#validateForm').click(function() {
    var isValid = $("#myForm").valid();
    alert(isValid);
  });

});