0

I would like to calculate the time frame between 2 dates that I got from html (input type date value).

I want to get the timeframe in years, months and days.

ie: 2017-01-01 & 2019-02-15

2 years, 1 month, 14 days

Thanks,

Aviz
  • 13
  • 6
  • 3
    Share efforts please, what have you tried ? – Alexis Feb 19 '19 at 15:57
  • 1
    What does "1 month" mean? If you aren't sure about how many days a month should have, then, I advice you to check [moment.js](https://momentjs.com/) – amedina Feb 19 '19 at 15:57
  • As noted by @amedina you could use the moment.js. Here's an example from another stackoverflow post that might help, [MomentJs exmple](https://stackoverflow.com/questions/33988129/moment-js-get-difference-in-two-birthdays-in-years-months-and-days) – jack Feb 19 '19 at 16:05
  • Hi Gary, No! this is not what I needed. Answers below – Aviz Feb 19 '19 at 17:14

3 Answers3

1

you can use the moment library 

var a = moment([2017, 1, 1]);
var b = moment([2019, 2,15]);

b.diff(a, 'days')  //get difference in days.. 
b.diff(a, 'months') //get difference in months.
b.diff(a, 'years') //get difference in years..

or 

diff = b.diff(a);

years = moment.duration(diff).get(years);
months = moment.duration(diff).get(months);
days = moment.duration(diff).get(days);

you can find the library here.. Moment.js library

i hope this helps..

Ande Caleb
  • 1,163
  • 1
  • 14
  • 35
  • Thank you, I like pure javascript with no library, because I new to develop and I want to learn the basic first :) – Aviz Feb 19 '19 at 17:15
1

you can use this function.

<script>
    function getDateDifference(startDate, endDate) {
      if (startDate > endDate) {
        console.error('Start date must be before end date');
        return null;
      }
      var startYear = startDate.getFullYear();
      var startMonth = startDate.getMonth();
      var startDay = startDate.getDate();

      var endYear = endDate.getFullYear();
      var endMonth = endDate.getMonth();
      var endDay = endDate.getDate();

      var february = (endYear % 4 == 0 && endYear % 100 != 0) || endYear % 400 == 0 ? 29 : 28;
      var daysOfMonth = [31, february, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];

      var startDateNotPassedInEndYear = (endMonth < startMonth) || endMonth == startMonth && endDay < startDay;
      var years = endYear - startYear - (startDateNotPassedInEndYear ? 1 : 0);

      var months = (12 + endMonth - startMonth - (endDay < startDay ? 1 : 0)) % 12;

      var days = startDay <= endDay ? endDay - startDay : daysOfMonth[(12 + endMonth - 1) % 12] - startDay + endDay;

      return {
        years: years,
        months: months,
        days: days
      };
    }

    var result = getDateDifference(new Date("2018-01-01"), new Date("2019-01-02"));

    //Print in console array with value
    console.log(result);

    var text = result.years+" year, "+result.months+" month, "+result.days+" days";
    alert(text);
</script>

use getDateDifference and parameters first date and second date. In alert i insert a demo print.

Davide
  • 566
  • 3
  • 13
  • Thanks, I liked this solution :) can you explain me this code, please: return { years: years, months: months, days: days }; – Aviz Feb 19 '19 at 17:11
  • and also, what in "var february" you check if the last year is leap year. what if the first year also leap? or there are years between the time frame of 2 dates? how can I check this? – Aviz Feb 19 '19 at 17:18
  • It automatically controls the function of javascript, leap or not! (object `new Date`) The return simply returns an array with the following keys: year, month, and day. So by recalling that function you can extrapolate the data you want (e.g. result.years or result.months or result.days). Simply subdivide the data into 3 distinct variables – Davide Feb 20 '19 at 16:37
  • If you want check if year is leap or not use this function: function leapyear(year){ return (year % 100 === 0) ? (year % 400 === 0) : (year % 4 === 0); } . so you just need to print `leapyear(2019` and return true or false – Davide Feb 20 '19 at 16:40
1

function getTimeBetweenDates(e) {
  var date1 = new Date(document.getElementById("date1").value);
  var date2 = new Date(document.getElementById("date2").value);

  var diff;

  if (date1 < date2) {
    diff = new Date(date2 - date1);
  } else {
    diff = new Date(date1 - date2);
  }

  var years = (diff.getFullYear() - 1970);
  var months = diff.getMonth();
  var days = diff.getDate();

  var yearTxt = "year";
  var monthTxt = "month";
  var dayTxt = "day";

  if (years > 1) yearTxt += "s";
  if (months > 1) monthTxt += "s";
  if (days > 1) dayTxt += "s";

  if (years >= 0) {
    document.getElementById("showdiff").innerHTML = years + " " + yearTxt + ", " + months + " " + monthTxt + ", " + days + " " + dayTxt;
  } else {
    document.getElementById("showdiff").innerHTML = "Equal dates";
  }
}
<form id="form1" action="" method="" onSubmit="event.preventDefault(); getTimeBetweenDates();">
  <input type="date" id="date1">
  <input type="date" id="date2">
</form>

<br>
<button type="submit" form="form1" value="Send">Send</button>

<br>
<p id="showdiff"></p>
Arthur Ferreira
  • 152
  • 5