Check if date is in the past Javascript

JavascriptJqueryJquery UiValidationDate

Javascript Problem Overview


All, I'm using the jQuery UI for the date picker. I'm trying to check with javascript though that the date the user has entered is in the past. Here is my form code:

<input type="text" id="datepicker" name="event_date" class="datepicker">

Then how would I check this with Javascript to make sure it isn't a date in the past? Thanks

Javascript Solutions


Solution 1 - Javascript

$('#datepicker').datepicker().change(evt => {
  var selectedDate = $('#datepicker').datepicker('getDate');
  var now = new Date();
  now.setHours(0,0,0,0);
  if (selectedDate < now) {
    console.log("Selected date is in the past");
  } else {
    console.log("Selected date is NOT in the past");
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<input type="text" id="datepicker" name="event_date" class="datepicker">

Solution 2 - Javascript

var datep = $('#datepicker').val();

if(Date.parse(datep)-Date.parse(new Date())<0)
{
   // do something
}

Solution 3 - Javascript

To make the answer more re-usable for things other than just the datepicker change function you can create a prototype to handle this for you.

// safety check to see if the prototype name is already defined
Function.prototype.method = function (name, func) {
    if (!this.prototype[name]) {
        this.prototype[name] = func;
        return this;
    }
};
Date.method('inPast', function () {
    return this < new Date($.now());// the $.now() requires jQuery
});

// including this prototype as using in example
Date.method('addDays', function (days) {
    var date = new Date(this);
    date.setDate(date.getDate() + (days));    
    return date;
});

If you dont like the safety check you can use the conventional way to define prototypes:

Date.prototype.inPast = function(){
    return this < new Date($.now());// the $.now() requires jQuery
}

Example Usage

var dt = new Date($.now());
var yesterday = dt.addDays(-1);
var tomorrow = dt.addDays(1);
console.log('Yesterday: ' + yesterday.inPast());
console.log('Tomorrow: ' + tomorrow.inPast());

Solution 4 - Javascript

Simply convert the dates into milliseconds and subtract

let givenDate1 =   new Date("10/21/2001")  // Past Date
let givenDate2 =   new Date("10/21/2050") // future Date

If diff is positive, then given date is PAST

 let diff = new Date().getTime() - givenDate1.getTime();
  if (diff > 0) {
     console.log('Given Date givenDate1 is in Past');
   }

If diff is negative, then given date is Future

 let diff = new Date().getTime() - givenDate2.getTime();
  if (diff < 0) {
     console.log('Given Date givenDate2 is in Future');
   }

Solution 5 - Javascript

function isPrevDate() {
	alert("startDate is " + Startdate);
	if(Startdate.length != 0 && Startdate !='') {
		var start_date = Startdate.split('-');
		alert("Input date: "+ start_date);
		start_date=start_date[1]+"/"+start_date[2]+"/"+start_date[0];
		alert("start date arrray format " + start_date);
		var a = new Date(start_date);
		//alert("The date is a" +a);
		var today = new Date();
		var day = today.getDate();
		var mon = today.getMonth()+1;
		var year = today.getFullYear();
		today = (mon+"/"+day+"/"+year);
		//alert(today);
		var today = new Date(today);
		alert("Today: "+today.getTime());
		alert("a : "+a.getTime());
		if(today.getTime() > a.getTime() )
		{
			alert("Please select Start date in range");
			return false;
		} else {
			return true;
		}
	}
}

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
Questionuser1048676View Question on Stackoverflow
Solution 1 - JavascriptAmadanView Answer on Stackoverflow
Solution 2 - JavascriptSrinivasan SView Answer on Stackoverflow
Solution 3 - JavascriptMikeView Answer on Stackoverflow
Solution 4 - JavascriptmabdullahseView Answer on Stackoverflow
Solution 5 - JavascriptVigneshView Answer on Stackoverflow