39

I have two String fields which represent Dates in my page and I would like to compare these two fields to know if my first date < second date. How can I do this?

<tr>
    <td align="right">First Date: </td>
    <td align="left"> <html:text name="addPublicationForm" styleId="firstDate" property="firstDate" maxlength="10"/></td>
</tr>
<tr>
    <td align="right">Second Date: </td>
    <td align="left"> <html:text name="addPublicationForm" styleId="secondDate" property="secondDate" maxlength="10"/></td>
</tr>
AJ Bovaird
  • 9
  • 1
  • 5
Mercer
  • 9,736
  • 30
  • 105
  • 170

6 Answers6

62
var startDt=document.getElementById("startDateId").value;
var endDt=document.getElementById("endDateId").value;

if( (new Date(startDt).getTime() > new Date(endDt).getTime()))
{
    ----------------------------------
}
stema
  • 90,351
  • 20
  • 107
  • 135
samba
  • 621
  • 5
  • 2
26

If you are also using jQuery ui, in particular datepicker, you can use $.datepicker.parseDate(format, string) to turn your date strings into a JavaScript Date object, which you can then compare using the standard < and >

gnarf
  • 105,192
  • 25
  • 127
  • 161
  • 1
    Shouldn't the `Date` object returned from the code be converted into milliseconds using `Date.parse` ( https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/parse?redirectlocale=en-US&redirectslug=JavaScript%2FReference%2FGlobal_Objects%2FDate%2Fparse) before making the comparison ? – Istiaque Ahmed Sep 01 '13 at 06:08
  • Parsing of date strings with the Date constructor (and Date.parse, they are equivalent) is strongly discouraged due to browser differences and inconsistencies: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date#Two_digit_years_map_to_1900_-_1999 – Mr.Mountain Feb 21 '17 at 13:53
9
var startDate = $('#start_date').val().replace(/-/g,'/');
var endDate = $('#end_date').val().replace(/-/g,'/');

if(startDate > endDate){
   // do your stuff here...
}
Vikash Singh
  • 804
  • 1
  • 10
  • 11
  • Do you know why mine is failing? http://stackoverflow.com/questions/32015131/why-does-the-each-function-in-jquery-not-iterate – Si8 Aug 14 '15 at 17:32
  • 1
    the second "-" is not replaced, try /-/g. – Bhimbim Nov 22 '16 at 14:47
  • hello, this function will work but as stated above only one of hypen will be replaced so you can use var startDate = $('#start_date').val().replace('-','/').replace('-','/'); var endDate = $('#end_date').val().replace('-','/').replace('-','/'); if(startDate > endDate){ // do your stuff here... } – Khadka Pushpendra Aug 07 '17 at 11:14
  • 1
    This doesn't work, don't use it. You can't compare strings like that. Also, @Khadka you can just do a global replacement if you know how to regex. `$('#start_date').val().replace(/-/g,'/')` – Tyler Christian Jan 04 '18 at 22:35
4

just use the jQuery datepicker UI library and convert both your strings into date format, then you can easily compare. following link might be useful

https://stackoverflow.com/questions/2974496/jquery-javascript-convert-date-string-to-date

cheers..!!

svg
  • 499
  • 5
  • 7
2

check the solution provided here it may help, i use it in my projects. http://trentrichardson.com/examples/timepicker/ .(in the end of the page)

timmz
  • 2,194
  • 3
  • 23
  • 29
2

Once you are able to parse those strings into a Date object comparing them is easy (Using the < operator). Parsing the dates will depend on the format. You may take a look at Datejs which might simplify this task.

Darin Dimitrov
  • 1,023,142
  • 271
  • 3,287
  • 2,928