joe date

by Joe

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.css" />
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js" integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30=" crossorigin=" anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>

<div class="form-group col-4 rfdate">
  <label class="col-sm-5 control-label p-sm-0" for="vouchdt">Voucher Date :</label>
  <div class="input-group vcdate datepic" id="vocdate">
    <input type="text" class="form-control" id="vochDate" name="vouchdt" th:field="*{strvouchdt}" />
    <span class="input-group-addon">
      <i class="glyphicon glyphicon-calendar"></i>
    </span>
  </div>
</div>

JavaScript

$(document).ready(function() {
  $('#vochDate, #refdate').datepicker({
    dateFormat: "dd/mm/yy",
    maxDate: '1y',
    minDate: "-10m"
  })
  .on("change", function(e) {
        var curDate = $(this).datepicker("getDate");
        var maxDate = new Date();
        maxDate.setDate(maxDate.getDate() + '1y'); // add one day
        maxDate.setHours(0, 0, 0, 0); // clear time portion for correct results
        console.log(this.value, curDate, maxDate);
        if (curDate > maxDate) {
            alert("invalid date");
            $(this).datepicker("setDate", maxDate);
        }
    });
});