jquery.inputmask date testing

A more complete test of jquery.inputmask using date fields with min/max year values.

by ThomasH

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="https://rawgit.com/RobinHerbots/jquery.inputmask/3.x/dist/jquery.inputmask.bundle.js"></script>
<script src="https://rawgit.com/RobinHerbots/jquery.inputmask/3.x/extra/bindings/inputmask.binding.js"></script>
<div class="form-group form-group-lg col-md-12">
  <span class="sr-only col-md-2">HICN:</span>
  <input class="form-control col-md-4" data-inputmask-mask="*{10,20}" data-val="true" data-val-required="Required" id="HICN" name="HICN" placeholder="HICN" type="text" value="" />
</div>

<div class="form-group form-group-lg col-md-12">
  <span class="sr-only col-md-2">DATE:</span>
  <input class="form-control col-md-3" data-inputmask-alias="mm/dd/yyyy" data-inputmask="'yearrange': { 'minyear': '1917', 'maxyear': '2016' }" data-val="true" data-val-required="Required" id="DATE" name="DATE" placeholder="mm/dd/yyyy" type="text" value="" />
</div>

<!-- J'D-alaud Jr., Fred, Esq. -->
<div class="form-group form-group-lg col-md-12">
  <span class="sr-only col-md-2">NAME:</span>
  <input class="form-control col-md-6" data-inputmask-regex="[A-Za-z0-9 .,'-]+" maxlength="25" data-val="true" data-val-required="Required" id="NAME" name="NAME" placeholder="NAME" type="text" value="" />
</div>

<!-- Apt #302 -->
<div class="form-group form-group-lg col-md-12">
  <span class="sr-only col-md-2">ADDR1:</span>
  <input class="form-control col-md-6" data-inputmask-regex="[A-Za-z0-9 #.,'-]+" maxlength="25" data-val="true" data-val-required="Required" id="ADDR1" name="ADDR1" placeholder="ADDR1" type="text" value="" />
</div>

<div class="form-group form-group-lg col-md-12">
  <span class="sr-only col-md-2">PHONE:</span>
  <input class="form-control col-md-4" data-inputmask-mask="(999)999-9999" data-val="true" data-val-required="Required" id="PHONE" name="PHONE" placeholder="PHONE" type="text" value="" />
</div>

<div class="form-group form-group-lg col-md-12">
  <span class="sr-only...

CSS

input,
body {
  font-size: 16px;
}
.col-md-2 { width: 100px; }
.col-md-3 { width: 150px; }
.col-md-4 { width: 200px; }
.col-md-6 { width: 300px; }
.col-md-12 { width: 800px; }

JavaScript

$(document).ready(function() {
  $(":input[data-inputmask-mask]").inputmask();
  $(":input[data-inputmask-alias]").inputmask();
  $(":input[data-inputmask-regex]").inputmask("Regex");
  
  
});

// URLs for External resources

// https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js
// https://rawgit.com/RobinHerbots/jquery.inputmask/3.x/dist/jquery.inputmask.bundle.js
// https://rawgit.com/RobinHerbots/jquery.inputmask/3.x/extra/bindings/inputmask.binding.js