jQuery Validate DateAfter Method

by Chan Wu

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.14.0/jquery.validate.min.js"></script>
<form id="validate">
    <div><input type="text" name="date1"></div>
    <div><input type="text" name="date2"></div>
    <div><input type="text" name="date3"></div>
    <button type="submit">go</button>
</form>

JavaScript

console.clear();

jQuery.validator.addMethod("dateAfter", function(value, element) {
    var now = new Date(),
        theDate = new Date(Date.parse(value.replace(/-/g, '/')));
      
    return this.optional(element) || theDate >= now;
}, '日期必須大於等於現在');

var date = new Date();
var yearMonth = date.getFullYear() + '-' + (date.getMonth() + 1) + '-';
var day = date.getDate();
var hoursMinutes = ' ' + date.getHours() + ':' + (date.getMinutes() + 1);

$('#validate :text').each(function(i) {
    $(this).val(yearMonth + (day + i - 1) + hoursMinutes);
});

$('#validate').validate({
    debug: true,
    rules: {
        date1: "dateAfter",
        date2: "dateAfter",
        date3: "dateAfter"
    }
});