Using jQuery Validation plugin
Requires both the jquery.validate.js and additional-methods.js plugins
HTML
<script src="https://github.com/jzaefferer/jquery-validation/raw/master/jquery.validate.js"></script>
<script src="https://github.com/jzaefferer/jquery-validation/raw/master/additional-methods.js"></script>
<form action="#" method="post" name="first-form">
<input type="text" name="name" minlength="2" maxlength="30" pattern="^[a-zA-Z\s]+$" placeholder="Name" title="Name is required, and must contain between 2 and 30 alpha characters" />
<button type="submit">Submit</button>
</form>
<form action="#" method="post" name="second-form">
<input type="text" name="name" required minlength="2" maxlength="30" pattern="^[a-zA-Z\s]+$" placeholder="Name" title="Name is required, and must contain between 2 and 30 alpha characters" />
<button type="submit">Submit</button>
</form>
CSS
form label.error { color:Red; background-color:Yellow; }
JavaScript
/*$(function() {
$("form").each(function(){
$(this).validate({
rules:{
},
submitHandler: function (form) {
return false; //temporarily prevent full submit
}
});
});
});*/