How to add days to date using jQuery

Question

I have input text like below:

$('#term').change(function() {
  var ll = $(this).val();
  var bb = $('#date').val();
  var date = new Date(bb);
  var newDate = new Date(date);
  newDate.setDate(newDate.getDate() + parseInt(ll));
  var dd = newDate.getDate();
  var mm = newDate.getMonth() + 1;
  var y = newDate.getFullYear();
  var someFormattedDate = dd + '-' + mm + '-' + y;
  $('#due_date').val(someFormattedDate);
});

div {
  margin: 10px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form-group">
  <label for="date">Date:</label>
  <input id="invodate" type="text" id="date" class="form-control" name="date" value="" style="width: 150px;">
</div>
<div class="form-group">
  <label for="term">Term:</label>
  <input type="text" class="form-control" id="term" name="term" value="" style="width: 50px;">
</div>
<div class="form-group">
  <label for="due_date">Due Date:</label>
  <input type="text" class="form-control" id="due_date" name="due_date" value="" style="width: 150px;">
</div>

I wanna give days to input #term and then on Due Date in input show date, but in my code show NaN-NaN-NaN only. What error with my code. thank for answer.

`moment(date).add( 2, "days" ).format("YYYY/MM/DD")` :) Check out moment.js — Jeremy Thille, Jul 01 '17 at 07:03

score 3 · Answer 1 · edited Jul 01 '17 at 11:47

3

Your first input has two ID's, which is invalid, and you're passing a date object to the Date constructor.

This is quite simple with plain javascript

$('#term').change(function() {
  var ll = $(this).val();
  var bb = $('#date').val();
  var date = new Date(bb);

  date.setDate(date.getDate() + (+ll));

  var dd = date.getDate();
  var mm = date.getMonth() + 1;
  var y = date.getFullYear();
  var someFormattedDate = dd + '-' + mm + '-' + y;

  $('#due_date').val(someFormattedDate);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form-group">
  <label for="date">Date:</label>
  <input type="text" id="date" class="form-control" name="date" value="05-05-2017" style="width: 150px;">
</div>
<div class="form-group">
  <label for="term">Term:</label>
  <input type="text" class="form-control" id="term" name="term" value="" placeholder="type here" style="width: 50px;">
</div>
<div class="form-group">
  <label for="due_date">Due Date:</label>
  <input type="text" class="form-control" id="due_date" name="due_date" value="" style="width: 150px;">
</div>

edited Jul 01 '17 at 11:47

Milan Chheda

8,159
3
20
35

answered Jul 01 '17 at 07:15

adeneo

312,895
29
395
388

why do i get `16-5-2017` for `Date: 05-05-2017, Term: 10`? – xGeo Jul 01 '17 at 07:17
Because 5 + 11 equals 16. I don't know what `term` is, I just copied the OP's hard coded `11` – adeneo Jul 01 '17 at 07:18
OP uses `term` to add the `date`. that is: `date.getDate() + term` – xGeo Jul 01 '17 at 07:20
You're right, I just deleted it and typed `11`, bad eyesight I guess. Changed it now – adeneo Jul 01 '17 at 07:20
Adebeo, Deleted where in jquery or html – Loy Bearna Jul 01 '17 at 07:26
@LoyBearna - I just edited my answer by deleting a hardcoded value of `11`, as in *eleven*, as I just misread your `ll` variable as such, that's all ! – adeneo Jul 01 '17 at 07:28

score -1 · Answer 2 · answered Jul 01 '17 at 07:09

-1

Nan (Not a number) getDate function does not return integer. Object + 11 is not a valid operation (most of the time!).

You can use Datejs mentioned here

var duedate = new Date.today().addDays(11);

answered Jul 01 '17 at 07:09

user2102266

539
3
14

or moment as @Jeremy adviced. – user2102266 Jul 01 '17 at 07:10

How to add days to date using jQuery

2 Answers2