Validate form
by mwoods98
HTML
<link rel="stylesheet" href="http://pepitodanger.free.fr/maquette_form/css/layout.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.14.0/jquery.validate.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.14.0/additional-methods.js"></script>
<div class="col-md-9 column" align="left">
<h3>Add Candidate</h3>
</div>
<form class="form-horizontal" name="addcandidate" id="addcandidate" action="" novalidate>
<div class="col-md-9 column">
<div class="tabbable">
<ul class="nav nav-tabs">
<li class="active"><a href="#pane1" data-toggle="tab">Demographics</a></li>
</ul>
<div class="tab-content">
<div id="pane1" class="tab-pane active">
<div class="well">
<div class="row">
<div class="col-xs-12">
<fieldset>
<div class='row'>
<div class='col-sm-4'>
<div class='form-group'>
<label for="user_title">First Name</label> *
<input class="form-control" id="firstName" name="firstName" value="" size="30" type="text" maxlength="45"/>
</div>
</div>
<div class='col-sm-4'>
...
JavaScript
$(function () {
$.validator.setDefaults({
errorClass: 'help-block',
highlight: function (element) {
$(element)
.closest('.form-group')
.addClass('has-error');
},
unhighlight: function (element) {
$(element)
.closest('.form-group')
.removeClass('has-error');
},
errorPlacement: function (error, element) {
if (element.prop('type') === 'radio') {
error.insertAfter(element.parent());
} else {
error.insertAfter(element);
}
}
});
$.validator.addMethod("goodDate", function (value, element) {
// put your own logic here, this is just a (crappy) example
return this.optional(element) || value.match(/((0[13578]|1[02])[\/.](0[1-9]|[12][0-9]|3[01])[\/.](18|19|20)[0-9]{2})|((0[469]|11)[\/.](0[1-9]|[12][0-9]|30)[\/.](18|19|20)[0-9]{2})|((02)[\/.](0[1-9]|1[0-9]|2[0-8])[\/.](18|19|20)[0-9]{2})|((02)[\/.]29[\/.](((18|19|20)(04|08|[2468][048]|[13579][26]))|2000))/);
}, "Please enter a date in the format mm/dd/yyyy.");
$.validator.addMethod('strongPassword', function (value, element) {
return this.optional(element) || value.length >= 6 && /\d/.test(value) && /[a-z]/i.test(value);
}, 'Your password must be at least 6 characters long and contain at least one number and one char\'.')
$("#addcandidate").validate({
rules: {
firstName: {
required: true,
nowhitespace: true,
lettersonly: true
},
Gender: {
required: true
},
serviceComputationDate: {
nowhitespace: true,
goodDate: true
},
EmpType: {
required: true
},
stepIncreaseDate: {
nowhitespace: true,
goodDate:...