how to alert if the input date is greater than defined date in js

Question

I am having an input date field in my form. In my date field i need to alert an error if the input date is greater than any date i define before here is what i code :

$(document).ready(function () {
    var date = new Date(2016,2,1); //the defined date is 1 March 2016
    var day = date.getDate();
    var month = date.getMonth();
    month = month + 1;

    if(day < 10){
        day = '0' + day;
    }

    if(month < 10){
        month='0'+month;
    }

    someday = day + '/' + month + '/' + date.getFullYear();

    $("#q1 input").blur(function(){   //#q1 is the ID for the input field.
        if($('#q1 input').val() > someday){
            alert('the input is bigger than the defined');
        }else{  
            alert('the defined is bigger than the input ');
        }
    });
});

If `q1` is id for input field, then I don't think you need to use `#q1 input` you can use `#q1` directly. — Apb, Mar 28 '16 at 06:51
You can compare Date objects directly: `if (date0 > date1) {/* date0 is after date1 */`. — RobG, Mar 28 '16 at 07:18

score 1 · Answer 1 · answered Mar 28 '16 at 07:29

1

To compare Dates is very straight forward. Most operators coerce the operands to number, and Dates return their time value so to see if today is before or after say 1 March 2016, create two Dates and compare them:

var epoch = new Date(2016,2,1); // Create date for 2016-03-01T00:00:00
var now   = new Date();         // Create a date for the current instant
now.setHours(0,0,0,0);          // Set time to 00:00:00.000

if (now < epoch) {
  alert('Before 1 March, 2016');
} else {
  alert('On or after 1 March, 2016');
}

Or a bit more compact:

alert((now < epoch? 'Before':'On or after') + ' 1 March, 2016');

answered Mar 28 '16 at 07:29

RobG

142,382
31
172
209

it is ok if i want to compare between the current date (now) and the defined date. but the problem i facing is that i have input field in my form it's type is text so date inside this field is string format , any way to convert it to date then compare between two dates ? – M.Gooda Mar 28 '16 at 10:02
@M.Gooda—see the accepted answer to [*javascript Date.parse*](http://stackoverflow.com/questions/2587345/javascript-date-parse/2587398#2587398). – RobG Mar 28 '16 at 12:02

score 0 · Answer 2 · answered Mar 28 '16 at 06:45

0

You might want to compare the values as in the date form, not the way you did. Convert the input value into the form of date and compare it with the variable 'date'.

answered Mar 28 '16 at 06:45

Inpyo Jeon

220
1
7

i know that the reason of problem is comparing string format with date format but what i do not know how to convert string to date format to compare between them. – M.Gooda Mar 28 '16 at 09:39

score 0 · Answer 3 · answered Mar 28 '16 at 06:52

0

Compare the input date with the desired date that you defined. For example:

var d1 = new Date();
var d2 = new Date(d1);
var same = d1.getTime() === d2.getTime();
var notSame = d1.getTime() !== d2.getTime();

If you find it tricky, then there is an awesome js library called moment.js. It is very useful when playing with dates.

answered Mar 28 '16 at 06:52

uvishere

455
6
22

To determine if *d1* is before *d2* is not tricky: `if (d1 < d2)`. – RobG Mar 28 '16 at 07:19

score 0 · Answer 4 · edited Sep 23 '21 at 05:47

$(document).ready(function () {
    var date=new Date(2016,2,1); //the defined date is 1 March 2016
    var fixedDate = returnDate(date);// convert date in dd/mm/yyyy format
 
    //#q1 input will search a child input inside an #q1 dom element, which probably not the case
    // input#q1 will refer to input with id #q1
   // You can directly query the input since it has id #q1 so #q1 input is not correct


$("#q1").blur(function(){   //#q1 is the ID for the input field.
 var d2 = new Date($('#q1').val());
 var inputDate = returnDate(d2); // convert input date in dd/mm/yyyy format

 if(inputDate > fixedDate){ // compare two dates
  console.log('the input is bigger than the defined');
  }else{    
  console.log('the defined is bigger than the input ');
}
});
});

// Write a general function to convert date in dd/mm/yyyy format
function returnDate(date){
   var day=date.getDate();
    var month=date.getMonth();
    month=month+1;
    if(day<10){
    day='0'+day;
 }
   if(month<10){
   month='0'+month;
 }
 var someday=day+ '/' + month + '/' + date.getFullYear();
  return someday;
}

JSFIDDLE

EDIT 1

Use ternary operator instead of if-else

inputDate > fixedDate? (console.log("the input is bigger than the defined")):(console.log("the defined is bigger than the input"))

with ternary operator

This compares two strings, not two dates so any date string with a bigger day than any other date string will be "bigger", regardless of month or year. — RobG, Mar 28 '16 at 07:21
Exactly, but how to convert the string format to date format to compare between them — M.Gooda, Mar 28 '16 at 09:41

how to alert if the input date is greater than defined date in js

4 Answers4