Can someone suggest a way to compare the values of two dates greater than, less than, and not in the past using JavaScript? The values will be coming from text boxes.
42 Answers
The Date object will do what you want - construct one for each date, then compare them using the >, <, <= or >=.
The ==, !=, ===, and !== operators require you to use date.getTime() as in
var d1 = new Date();
var d2 = new Date(d1);
var same = d1.getTime() === d2.getTime();
var notSame = d1.getTime() !== d2.getTime();
to be clear just checking for equality directly with the date objects won't work
var d1 = new Date();
var d2 = new Date(d1);
console.log(d1 == d2); // prints false (wrong!)
console.log(d1 === d2); // prints false (wrong!)
console.log(d1 != d2); // prints true (wrong!)
console.log(d1 !== d2); // prints true (wrong!)
console.log(d1.getTime() === d2.getTime()); // prints true (correct)
I suggest you use drop-downs or some similar constrained form of date entry rather than text boxes, though, lest you find yourself in input validation hell.
For the curious, date.getTime() documentation:
Returns the numeric value of the specified date as the number of milliseconds since January 1, 1970, 00:00:00 UTC. (Negative values are returned for prior times.)
The easiest way to compare dates in javascript is to first convert it to a Date object and then compare these date-objects.
Below you find an object with three functions:
dates.compare(a,b)
Returns a number:
- -1 if a < b
- 0 if a = b
- 1 if a > b
- NaN if a or b is an illegal date
dates.inRange (d,start,end)
Returns a boolean or NaN:
- true if d is between the start and end (inclusive)
- false if d is before start or after end.
- NaN if one or more of the dates are illegal.
dates.convert
Used by the other functions to convert their input to a date object. The input can be
- a date-object : The input is returned as is.
- an array: Interpreted as [year,month,day]. NOTE month is 0-11.
- a number : Interpreted as number of milliseconds since 1 Jan 1970 (a timestamp)
- a string : Several different formats is supported, like "YYYY/MM/DD", "MM/DD/YYYY", "Jan 31 2009" etc.
- an object: Interpreted as an object with year, month and date attributes. NOTE month is 0-11.
.
// Source: http://stackoverflow.com/questions/497790
var dates = {
convert:function(d) {
// Converts the date in d to a date-object. The input can be:
// a date object: returned without modification
// an array : Interpreted as [year,month,day]. NOTE: month is 0-11.
// a number : Interpreted as number of milliseconds
// since 1 Jan 1970 (a timestamp)
// a string : Any format supported by the javascript engine, like
// "YYYY/MM/DD", "MM/DD/YYYY", "Jan 31 2009" etc.
// an object : Interpreted as an object with year, month and date
// attributes. **NOTE** month is 0-11.
return (
d.constructor === Date ? d :
d.constructor === Array ? new Date(d[0],d[1],d[2]) :
d.constructor === Number ? new Date(d) :
d.constructor === String ? new Date(d) :
typeof d === "object" ? new Date(d.year,d.month,d.date) :
NaN
);
},
compare:function(a,b) {
// Compare two dates (could be of any type supported by the convert
// function above) and returns:
// -1 : if a < b
// 0 : if a = b
// 1 : if a > b
// NaN : if a or b is an illegal date
// NOTE: The code inside isFinite does an assignment (=).
return (
isFinite(a=this.convert(a).valueOf()) &&
isFinite(b=this.convert(b).valueOf()) ?
(a>b)-(a<b) :
NaN
);
},
inRange:function(d,start,end) {
// Checks if date in d is between dates in start and end.
// Returns a boolean or NaN:
// true : if d is between start and end (inclusive)
// false : if d is before start or after end
// NaN : if one or more of the dates is illegal.
// NOTE: The code inside isFinite does an assignment (=).
return (
isFinite(d=this.convert(d).valueOf()) &&
isFinite(start=this.convert(start).valueOf()) &&
isFinite(end=this.convert(end).valueOf()) ?
start <= d && d <= end :
NaN
);
}
}
what format?
If you construct a Javascript Date object, you can just subtract them to get a milliseconds difference (edit: or just compare them) :
js>t1 = new Date()
Thu Jan 29 2009 14:19:28 GMT-0500 (Eastern Standard Time)
js>t2 = new Date()
Thu Jan 29 2009 14:19:31 GMT-0500 (Eastern Standard Time)
js>t2-t1
2672
js>t3 = new Date('2009 Jan 1')
Thu Jan 01 2009 00:00:00 GMT-0500 (Eastern Standard Time)
js>t1-t3
2470768442
js>t1>t3
true
The simple way is,
var first = '2012-11-21';
var second = '2012-11-03';
if (new Date(first) > new Date(second) {
.....
}
var date = new Date(); // will give you todays date.
// following calls, will let you set new dates.
setDate()
setFullYear()
setHours()
setMilliseconds()
setMinutes()
setMonth()
setSeconds()
setTime()
var yesterday = new Date();
yesterday.setDate(...date info here);
if(date>yesterday) // will compare dates
BEWARE THE TIMEZONE
A javascript date has no notion of timezone. It's a moment in time (ticks since the epoch) with handy functions for translating to and from strings in the "local" timezone. If you want to work with dates using date objects, as everyone here is doing, you want your dates to represent UTC midnight at the start of the date in question. This is a common and necessary convention that lets you work with dates regardless of the season or timezone of their creation. So you need to be very vigilant to manage the notion of timezone, particularly when you create your midnight UTC Date object.
Most of the time, you will want your date to reflect the timezone of the user. Click if today is your birthday. Users in NZ and US click at the same time and get different dates. In that case, do this...
// create a date (utc midnight) reflecting the value of myDate and the environment's timezone offset.
new Date(Date.UTC(myDate.getFullYear(),myDate.getMonth(), myDate.getDate()));
Sometimes, international comparability trumps local accuracy. In that case, do this...
// the date in London of a moment in time. Device timezone is ignored.
new Date(Date.UTC(myDate.getUTCYear(), myDate.getyUTCMonth(), myDate.getUTCDate()));
Now you can directly compare your date objects as the other answers suggest.
Having taken care to manage timezone when you create, you also need to be sure to keep timezone out when you convert back to a string representation. So you can safely use...
toISOString()getUTCxxx()getTime() //returns a number with no time or timezone..toLocaleDateString("fr",{timezone:"UTC"}) // whatever locale you want, but ALWAYS UTC.
And totally avoid everything else, especially...
getYear(),getMonth(),getDate()
Performance
Today 2020.02.27 I perform tests of chosen solutions on Chrome v80.0, Safari v13.0.5 and Firefox 73.0.1 on MacOs High Sierra v10.13.6
Conclusions
- solutions
d1==d2(D) andd1===d2(E) are fastest for all browsers - solution
getTime(A) is faster thanvalueOf(B) (both are medium fast) - solutions F,L,N are slowest for all browsers
Details
In below snippet solutions used in performance tests are presented. You can perform test in you machine HERE
function A(d1,d2) {
return d1.getTime() == d2.getTime();
}
function B(d1,d2) {
return d1.valueOf() == d2.valueOf();
}
function C(d1,d2) {
return Number(d1) == Number(d2);
}
function D(d1,d2) {
return d1 == d2;
}
function E(d1,d2) {
return d1 === d2;
}
function F(d1,d2) {
return (!(d1>d2 || d2>d1));
}
function G(d1,d2) {
return d1*1 == d2*1;
}
function H(d1,d2) {
return +d1 == +d2;
}
function I(d1,d2) {
return !(+d1 - +d2);
}
function J(d1,d2) {
return !(d1 - d2);
}
function K(d1,d2) {
return d1 - d2 == 0;
}
function L(d1,d2) {
return !((d1>d2)-(d1<d2));
}
function M(d1,d2) {
return d1.getFullYear() === d2.getFullYear()
&& d1.getDate() === d2.getDate()
&& d1.getMonth() === d2.getMonth();
}
function N(d1,d2) {
return (isFinite(d1.valueOf()) && isFinite(d2.valueOf()) ? !((d1>d2)-(d1<d2)) : false );
}
// TEST
let past= new Date('2002-12-24'); // past
let now= new Date('2020-02-26'); // now
console.log('Code d1>d2 d1<d2 d1=d2')
var log = (l,f) => console.log(`${l} ${f(now,past)} ${f(past,now)} ${f(now,now)}`);
log('A',A);
log('B',B);
log('C',C);
log('D',D);
log('E',E);
log('G',G);
log('H',H);
log('I',I);
log('J',J);
log('K',K);
log('L',L);
log('M',M);
log('N',N);p {color: red}<p>This snippet only presents tested solutions (it not perform tests itself)</p>Results for chrome
In order to create dates from free text in Javascript you need to parse it into the Date() object.
You could use Date.parse() which takes free text tries to convert it into a new date but if you have control over the page I would recommend using HTML select boxes instead or a date picker such as the YUI calendar control or the jQuery UI Datepicker.
Once you have a date as other people have pointed out you can use simple arithmetic to subtract the dates and convert it back into a number of days by dividing the number (in seconds) by the number of seconds in a day (60*60*24 = 86400).
My simple answer for this question
checkDisabled(date) {
const today = new Date()
const newDate = new Date(date._d)
if (today.getTime() > newDate.getTime()) {
return true
}
return false
}
All the above-given answers only solved one thing: compare two dates.
Indeed, they seem to be the answers to the question, but a big part is missing:
What if I want to check whether a person is fully 18 years old?
Unfortunately, NONE of the above-given answers would be able to answer that question.
For example, the current time (around the time when I started to type these words) is Fri Jan 31 2020 10:41:04 GMT-0600 (Central Standard Time), while a customer enters his Date of Birth as "01/31/2002".
If we use "365 days/year", which is "31536000000" milliseconds, we would get the following result:
let currentTime = new Date();
let customerTime = new Date(2002, 1, 31);
let age = (currentTime.getTime() - customerTime.getTime()) / 31536000000
console.log("age: ", age);
with the following print-out:
age: 17.92724710838407
But LEGALLY, that customer is already 18 years old. Even he enters "01/30/2002", the result would still be
age: 17.930039743467784
which is less than 18. The system would report the "under age" error.
And this would just keep going for "01/29/2002", "01/28/2002", "01/27/2002" ... "01/05/2002", UNTIL "01/04/2002".
A system like that would just kill all the customers who were born between 18 years 0 days and 18 years 26 days ago, because they are legally 18 years old, while the system shows "under age".
The following is an answer to a question like that:
invalidBirthDate: 'Invalid date. YEAR cannot be before 1900.',
invalidAge: 'Invalid age. AGE cannot be less than 18.',
public static birthDateValidator(control: any): any {
const val = control.value;
if (val != null) {
const slashSplit = val.split('-');
if (slashSplit.length === 3) {
const customerYear = parseInt(slashSplit[0], 10);
const customerMonth = parseInt(slashSplit[1], 10);
const customerDate = parseInt(slashSplit[2], 10);
if (customerYear < 1900) {
return { invalidBirthDate: true };
} else {
const currentTime = new Date();
const currentYear = currentTime.getFullYear();
const currentMonth = currentTime.getMonth() + 1;
const currentDate = currentTime.getDate();
if (currentYear - customerYear < 18) {
return { invalidAge: true };
} else if (
currentYear - customerYear === 18 &&
currentMonth - customerMonth < 0) {
return { invalidAge: true };
} else if (
currentYear - customerYear === 18 &&
currentMonth - customerMonth === 0 &&
currentDate - customerDate < 0) {
return { invalidAge: true };
} else {
return null;
}
}
}
}
}
You can date compare as most simple and understandable way like.
<input type="date" id="getdate1" />
<input type="date" id="getdate2" />
let suppose you have two date input you want to compare them.
so firstly write a common method to parse date.
<script type="text/javascript">
function parseDate(input) {
var datecomp= input.split('.'); //if date format 21.09.2017
var tparts=timecomp.split(':');//if time also giving
return new Date(dparts[2], dparts[1]-1, dparts[0], tparts[0], tparts[1]);
// here new date( year, month, date,)
}
</script>
parseDate() is the make common method for parsing the date. now you can checks your date =, > ,< any type of compare
<script type="text/javascript">
$(document).ready(function(){
//parseDate(pass in this method date);
Var Date1=parseDate($("#getdate1").val());
Var Date2=parseDate($("#getdate2").val());
//use any oe < or > or = as per ur requirment
if(Date1 = Date2){
return false; //or your code {}
}
});
</script>
For Sure this code will help you.
function compare_date(date1, date2){
const x = new Date(date1)
const y = new Date(date2)
function checkyear(x, y){
if(x.getFullYear()>y.getFullYear()){
return "Date1 > Date2"
}
else if(x.getFullYear()<y.getFullYear()){
return "Date2 > Date1"
}
else{
return checkmonth(x, y)
}
}
function checkmonth(x, y){
if(x.getMonth()>y.getFullYear()){
return "Date1 > Date2"
}
else if(x.getMonth()<y.getMonth){
return "Date2 > Date1"
}
else {
return checkDate(x, y)
}
}
function checkDate(x, y){
if(x.getDate()>y.getFullYear()){
return "Date1 > Date2"
}
else if(x.getDate()<y.getDate()){
return "Date2 > Date1"
}
else {
return checkhour(x,y)
}
}
function checkhour(x, y){
if(x.getHours()>y.getHours()){
return "Date1 > Date2"
}
else if(x.getHours()<y.getHours()){
return "Date2 > Date1"
}
else {
return checkhmin(x,y)
}
}
function checkhmin(x,y){
if(x.getMinutes()>y.getMinutes()){
return "Date1 > Date2"
}
else if(x.getMinutes()<y.getMinutes()){
return "Date2 > Date1"
}
else {
return "Date1 = Date2"
}
}
return checkyear(x, y)
If you are using **REACT OR REACT NATIVE**, use this and it will work (Working like charm)
If the two dates are the same, it will return TRUE otherwise FALSE
const compareDate = (dateVal1, dateVal2) => {
if (dateVal1.valueOf() === dateVal2.valueOf()){
return true;
}
else { return false;}
}
using momentjs for dates manipulation.
For checking one date is same or after as another by using
isSameOrAfter() method
moment('2010-10-20').isSameOrAfter('2010-10-20') //true;
For checking one date is after as another by using isAfter() method
moment('2020-01-20').isAfter('2020-01-21'); // false
moment('2020-01-20').isAfter('2020-01-19'); // true
For checking one date is before another by using isBefore() method.
moment('2020-01-20').isBefore('2020-01-21'); // true
moment('2020-01-20').isBefore('2020-01-19'); // false
For checking one date is same as another by using isSame() method
moment('2020-01-20').isSame('2020-01-21'); // false
moment('2020-01-20').isSame('2020-01-20'); // true
Related