Autocalculate the number of months between two dates

Question

slowlearner2010 -1 Newbie Poster

10 Years Ago

Hi guys,

I try to calculate number of month between 2 selected dates and i just got this code. The problem is this code calculate number of days and i try change the code from

var days = (end - start) / (1000 * 60 * 60 *24) ;
to
var days = (end - start) / (60 * 60 * 24 * 30);

Here the full code :

javascript:

$("#TextBox1").datepicker({
    minDate: 0,
    maxDate: '+1Y+6M',
    onSelect: function (dateStr) {
        var min = $(this).datepicker('getDate'); // Get selected date
        $("#TextBox2").datepicker('option', 'minDate', min || '0'); // Set other min, default to today
    }
});


$("#TextBox2").datepicker({
    minDate: '0',
    maxDate: '+1Y+6M',
    onSelect: function (dateStr) {
        var max = $(this).datepicker('getDate'); // Get selected date
        $('#datepicker').datepicker('option', 'maxDate', max || '+1Y+6M'); // Set other max, default to +18 months
        var start = $("#TextBox1").datepicker("getDate");
        var end = $("#TextBox2").datepicker("getDate");
        var days = (end - start) / (1000 * 60 * 60 *24);

        $("#TextBox3").val(days);
    }
});

html :

<p>Date From :
    <input type="text" id="TextBox1" /> </p> <p>Date To :
    <input type="text" id="TextBox2" /> </p> <p>Difference :
    <input type="text" id="TextBox3" /> </p>

i put 01-01-2015 to 31-01-2015 and the result is 1000 month. I dont know why the code make it 1000. Any advise and help from you guys?.....

javascript

3 Contributors
9 Replies
2K Views
6 Days Discussion Span
Latest Post 10 Years Ago Latest Post by Haji Sameon

Dani AI

Generated 11 Months Ago

The 1000 months result comes from dividing milliseconds by seconds. Subtracting two Date objects gives milliseconds. Your original days calc divided by 10006060*24, which is correct. When you switched to months you dropped the 1000, so you inflated the answer by x1000. Also, as @diafol hinted, be careful not to mix up jQuery UI datepicker('getDate') (returns a Date object) with JavaScript date.getDate() (returns the day of month number).

If you need whole calendar months (not approximate 30-day months), compute by year/month fields and then adjust when the end day is before the start day. This avoids DST and month-length pitfalls and matches expectations like 2015-01-01 to 2015-01-31 being 1 month if you choose an inclusive policy.

function diffMonthsCalendar(start, end, opts) {
  var inclusive = opts && opts.inclusive;
  var a = new Date(start.getFullYear(), start.getMonth(), start.getDate());
  var b = new Date(end.getFullYear(), end.getMonth(), end.getDate());
  var swap = b < a; if (swap) { var t = a; a = b; b = t; }

  var months = (b.getFullYear() - a.getFullYear()) * 12 + (b.getMonth() - a.getMonth());
  if (b.getDate() < a.getDate()) months -= 1;

  if (inclusive) {
    var lastDayB = new Date(b.getFullYear(), b.getMonth() + 1, 0).getDate();
    if (a.getDate() === 1 && b.getDate() === lastDayB) months += 1;
  }
  return swap ? -months : months;
}

For , if your popup writes dd-mm-yyyy strings, parse them to Date and reuse the same function:

function parseDMY(s) { var p = s.split("-"); return new Date(+p[2], p[1]-1, +p[0]); }
// usage:
var months = diffMonthsCalendar(parseDMY(d_start.value), parseDMY(d_end.value), { inclusive: true });

All 9 Replies

Member #120589

10 Years Ago

Your question is confusion - probably why nobody has replied yet.

The problem is this code calculate number of days and i try change the code from
var days = (end - start) / (1000 * 60 * 60 *24) ;
to
var days = (end - start) / (60 * 60 * 24 * 30);

So are you saying it worked before you changed it to the second example? Maybe you're not asking for js getDate but some property of the datepicker - but I don't know which one you're using.

Javascript getDate() gets the day date - not seconds since UNIX epoch. What are you expecting?

Edited 10 Years Ago by Member #120589

Member #120589

10 Years Ago

Which datepicker are you using jqueryui?

Member #120589

10 Years Ago

OK, you were almost there. I've set up a fiddle that seems to work for me: https://jsfiddle.net/diafol666/3ars3sfw/

Reply to this topic

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.

slowlearner2010 -1 Newbie Poster · Answer 1 · 2015-12-22T23:03:31+00:00

oh sorry, i forgot to change the second var days. it supposed to be var month.
var days = (end - start) / (1000 * 60 * 60 *24) ;
to
var month = (end - start) / (60 * 60 * 24 * 30);

i changed var days formula to var month formula because i want to calculate those days to month only. But the result i get is 1000 month instead 1 month. i put 01-01-2015 for Textbox1 and 31-01-2015 for Textbox2.

slowlearner2010 -1 Newbie Poster · Answer 2 · 2015-12-23T01:44:19+00:00

slowlearner2010 -1 Newbie Poster

10 Years Ago

yes sir, jquery.

slowlearner2010 -1 Newbie Poster · Answer 3 · 2015-12-23T03:16:07+00:00

slowlearner2010 -1 Newbie Poster

10 Years Ago

Thank mr diafol. that really useful for me...

Haji Sameon 12 Newbie Poster · Answer 4 · 2015-12-28T08:08:45+00:00

Hi, i have the same problem too, just i not using jqueryui datepicker. I use default html calendar. Here is my code :

<input name="d_start"  type=text id="d_start" value="<?php echo $_POST['start']; ?>" SIZE="20" maxlength="10">
<input name="kalendar12" type= "image" id="kalendar12" onClick="popUpCalendar(this, this.form.d_start,'dd-mm-yyyy');return false;" 
src="images/calendar.gif" alt="kalendar" />
<span class="style1">(hh-bb-tttt)</span>

Any way to help me? Plz....

Member #120589 · Answer 5 · 2015-12-28T16:19:48+00:00

You're not using default HTML calendar from what I can see - you are using a popUpCalendar script. Your HTML is rather messed up though. No quotes around text.

Haji Sameon 12 Newbie Poster · Answer 6 · 2015-12-29T02:34:17+00:00

Sorry, i still new in this php/html world. Im using the same javascript and popupcalendar for my calendar.
Here my full codes :

javascript :

$("#d_start").datepicker({
minDate: 0,
maxDate: '+1Y+6M',
onSelect: function (dateStr) {
var min = $(this).datepicker('getDate'); // Get selected date
$("#d_end").datepicker('option', 'minDate', min || '0'); // Set other min, default to today
}
});

$("#d_end").datepicker({
minDate: '0',
maxDate: '+1Y+6M',
onSelect: function (dateStr) {
var max = $(this).datepicker('getDate'); // Get selected date
$('#datepicker').datepicker('option', 'maxDate', max || '+1Y+6M'); // Set other max, default to +18 months
var start = $("#d_start").datepicker("getDate");
var end = $("#d_end").datepicker("getDate");
var days = (end - start) / (1000 * 60 * 60 *24);
$("#month").val(days);
}
});

html:

<tr>
<td><span class="style1">Date Start<span class="style5">*</span></span></td>
<td><span class="style1">:</span></td>
<td><input name="d_start"  type="text" id="d_start" size="20" maxlength="10">
<input name="kalendar12" type= "image" id="kalendar12" onClick="popUpCalendar(this, this.form.d_start,'dd-mm-yyyy');return false;" 
src="images/calendar.gif" alt="kalendar" />
<span class="style1">(hh-bb-tttt)</span></td>
</tr>

<tr>
<td><span class="style1">Date End<span class="style5">*</span></span></td>
<td><span class="style1">:</span></td>
<td><input name="d_end"  type="text" id="d_end" size="20" maxlength="10">
<input name="kalendar13" type= "image" id="kalendar13" onClick="popUpCalendar(this, this.form.d_end,'dd-mm-yyyy');return false;" 
src="images/calendar.gif" alt="kalendar" />
<span class="style1">(hh-bb-tttt)</span></td>
</tr>

<tr>
    <td> Total Month :
    <input type="text" id="month"/>
    </td>
</tr>

I've tried using your code and the total month still not working. I guess there's a problem with my calendar since you using datepicker. Should i change the onSelect code from datepicker to popupcalendar. Any proper solution for this?

Autocalculate the number of months between two dates

Dani AI

Recommended Answers Collapse Answers

All 9 Replies

Recommended Answers