JavaScript setDate() returns Invalid Date

Question

So, I have this code :

$('#end_date').click(function() 
{
    var start_date = new Date($('#start_date').val());
    var duration = parseInt($('#duration').val());

    var end_date = new Date();
    end_date.setDate(start_date + duration);

    $('#end_date').val($.datepicker.formatDate('yy-mm-dd', end_date));
});

Which, I believe, should take a start date from the form, and add some days (duration) in it, and the show the output in the other text field. However, the result I got is always NaN-NaN-NaN, or simply Invalid Date if I remove the formatting.

However :

$('#end_date').val($.datepicker.formatDate('yy-mm-dd', start_date));

works just fine. So I don't think the problem lies in the 3rd line. And now I confused. Any pointer to solve this problem?

Well, let's just [check the docs](https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Date/setDate)... — Blazemonger, Oct 30 '12 at 14:13
I think you'll be able to use the linked doc to fix your code, but beware another pitfall : always precise the radix when using [parseInt](https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/parseInt), because `parseInt('09')` is 0. — Denys Séguret, Oct 30 '12 at 14:15

score 2 · Accepted Answer · answered Oct 30 '12 at 14:13

2

setDate just sets the day of the month, and you could use setFullYear and setMonth or you can do this.

$('#end_date').click(function() 
{
    var start_date = new Date($('#start_date').val());
    var duration = parseInt($('#duration').val());

    var end_date = new Date();
    end_date.setDate(start_date.getMilliseconds() + duration.getMilliseconds());

    $('#end_date').val($.datepicker.formatDate('yy-mm-dd', end_date));
});

Hoping that start_Date and duration are returning milliseconds.

answered Oct 30 '12 at 14:13

Welling

556
3
9

ahh yeah, setMonth, should've use that instead. Thanks! – Furunomoe Oct 30 '12 at 14:24
1

This will not work (i) duration is a number, numbers do not have `.getMilliseconds` (ii) `.getMilliseconds` returns milliseconds portion of the specified date, not the number of milliseconds from the unix epoch. – Salman A Oct 30 '12 at 14:28

score 1 · Answer 2 · edited May 23 '17 at 11:43

1

According to this question, you should instead try:

end_date.setDate(start_date.getDate() + duration);

edited May 23 '17 at 11:43

Community

1
1

answered Oct 30 '12 at 14:16

Blazemonger

90,923
26
142
180

score 0 · Answer 3 · answered Oct 30 '12 at 14:18

As setDate only sets the day in the month, you could do this :

var duration = parseInt($('#duration').val(), 10); // don't forget the radix!
var end_date = new Date();
end_date.setTime(start_date.getTime()); // makes end_date a copy of start_date
end_date.setDate(start_date.getDate() + duration); // changes the day of the month (and recomputes months and years)

score 0 · Answer 4 · answered Oct 30 '12 at 14:21

$('#end_date').click(function() 
{
    var start_date = new Date($('#start_date').val());
    var duration = parseInt($('#duration').val());

    var end_date = new Date();
    end_date.setTime(start_date.getTime() + (duration*24*60*60*1000));//convert duration to miliseconds

    $('#end_date').val($.datepicker.formatDate('yy-mm-dd', end_date));
});

this should work, add duration to the time of start_date and set that Time to end_date

JavaScript setDate() returns Invalid Date

4 Answers4