Timespan javascript

Question

So i was looking for a function to get the timespan between two dates and i've found this answer on SO

However the date is in this format 7/Nov/2012 20:30:00 and my dates are 7/11/2012 20:30:00, and my values came from inputs

http://jsbin.com/igaruj/47/edit

If a try to change "Nov" to "11" i got NaN on the output. Do i have to convert the dates ?

Here is the code.

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
</head>
<body>
  <input type="text" id ="start"value="7/Nov/2012 20:30:00" />

  <input type="text" id="end" value="20/Nov/2012 19:15:00" />
</body>
</html>

The javascript

var startDate = document.getElementById("start").value;
var endDate = document.getElementById("end").value;

var date1 = new Date(startDate);
var date2 = new Date(endDate);

var diff = date2.getTime() - date1.getTime();

var days = Math.floor(diff / (1000 * 60 * 60 * 24));
diff -=  days * (1000 * 60 * 60 * 24);

var hours = Math.floor(diff / (1000 * 60 * 60));
diff -= hours * (1000 * 60 * 60);

var mins = Math.floor(diff / (1000 * 60));
diff -= mins * (1000 * 60);

var seconds = Math.floor(diff / (1000));
diff -= seconds * (1000);


console.log(days + " days : " + hours + " hours : " + mins + " minutes : " + seconds + " seconds");

If you don't mind using a javascript library for it; i suggest looking into momentjs http://momentjs.com/ — Marvin Smit, Sep 11 '14 at 11:23
Absolutely possible, but you will have to write a lot of the validation/parsing yourself, whereas a library has already done that for you. Look at an existing working library (like momentjs) and rewrite it to your heart's desire. — Marvin Smit, Sep 11 '14 at 11:39

score 1 · Answer 1 · answered Sep 11 '14 at 11:40

1

Use JavaScript's Date and simply call new Date("7/Nov/2012 20:30:00") to get a JS Date object. Then you could extract the day, month and year using methods on that Date object.

answered Sep 11 '14 at 11:40

Hrishi

7,110
5
27
26

Beware that the `Date` string constructor is inconsistent across different browsers and locales, so test thoroughly! I'd highly recommend [momentjs](http://momentjs.com/) instead. – quietmint Sep 11 '14 at 11:44
Yes, you should probably use momentjs. – Hrishi Sep 11 '14 at 11:45

score 1 · Accepted Answer · answered Sep 11 '14 at 11:59

With your 20/11/2012 20:30:00 date format:

var startDate = "7/11/2012 20:30:00";
var endDate = "20/11/2012 19:15:00";

You're getting the NaN because, it wants it in the format mm/dd/yyyy. So 20 is ofcourse an invalid month.. interchange the month and day values like:

var parts = startDate.split('/');
startDate = parts[1] + '/' + parts[0] + '/' + parts[2];
// 11/7/2012 20:30:00

var parts = endDate.split('/');
endDate = parts[1] + '/' + parts[0] + '/' + parts[2];
// 11/20/2012 9:15:00

and then do your normal time diff work and it will work:

var date1 = new Date(startDate);
var date2 = new Date(endDate);



var diff = date2.getTime() - date1.getTime();

var days = Math.floor(diff / (1000 * 60 * 60 * 24));
diff -=  days * (1000 * 60 * 60 * 24);

var hours = Math.floor(diff / (1000 * 60 * 60));
diff -= hours * (1000 * 60 * 60);

var mins = Math.floor(diff / (1000 * 60));
diff -= mins * (1000 * 60);

var seconds = Math.floor(diff / (1000));
diff -= seconds * (1000);

alert(days + " days : " + hours + " hours : " + mins + " minutes : " + seconds + " seconds");
//12 days 22 hours 45 minutes 0 seconds

See the DEMO here

Timespan javascript

2 Answers2