1

Jscript code part1

part2

When I try to calculate difference between two date picker's values the click function doesn't work. But when I try to do something simple like : document.getElementById("price").innerHTML = "safas"; it works.. I couldn't figure it out and also the code I use works in an empty page.

$(document).ready(function(){
  var $datepicker1 =  $( "#datepicker1" );
  var $datepicker2 =  $( "#datepicker2" );
  $datepicker1.datepicker();
  $datepicker2.datepicker({
     onClose: function() {
        var fromDate = $datepicker1.datepicker('getDate');
        var toDate = $datepicker2.datepicker('getDate');
        // date difference in millisec
        var diff = new Date(toDate - fromDate);
        // date difference in days
        var days = diff/1000/60/60/24;

        document.getElementById("Label1").innerHTML = days;
    }
 });
});

So I tried the suggested solutions and made some researches on it eventually I couldn't handle it.

derloopkat
  • 6,232
  • 16
  • 38
  • 45
newbiex1
  • 13
  • 5
  • Where is the full code including HTML. Please give text not image. – Rafique Ahmed Jan 14 '17 at 11:49
  • @RafiqueAhmed Thank you for your answer. here is jsfiddle https://jsfiddle.net/txxt1b7u/#&togetherjs=g7axFdc3gb – newbiex1 Jan 14 '17 at 11:56
  • For the record, pickadate() is not part of **jquery.ui**. Apparently your code in Fiddler is trying to use this library: **amsul.js**, which is not being loaded: http://amsul.ca/pickadate.js/date/ – derloopkat Jan 14 '17 at 12:23
  • @derloopkat @ newbiex I am not sure which framework you are using this not simple Jquery and JS – Rafique Ahmed Jan 14 '17 at 12:31
  • Similar to: http://stackoverflow.com/questions/40516971/jquery-datetimepicker-ui-getting-total-days-between-two-datetimepickers – Twisty Jan 17 '17 at 19:32

1 Answers1

0

I would advise writing a small function to help with this:

function dateDifference(start, end) {
  var d1 = new Date(start);
  var d2 = new Date(end);
  return Math.round(Math.abs((d2 - d1) / 86400000));
}

This function, given two date in String format, like mm/dd/yy or 01/21/2017, it will return the number of days between the two dates.

Here ius an example that is closer to your code: https://jsfiddle.net/Twisty/g0ujgbdo/

HTML

<label for="datepicker1">From</label>
<input type="text" id="datepicker1" name="from">
<label for="datepicker2">to</label>
<input type="text" id="datepicker2" name="to">
<p id="results"></p>

JavaScript

$(function() {
  var dF = "mm/dd/yy",
    from = $("#datepicker1")
    .datepicker()
    .on("change", function() {
      to.datepicker("option", "minDate", gD($(this)));
      if (from.datepicker("getDate") !== null && to.datepicker("getDate") !== null) {
        $("#results").html("You selected " + dateDifference(from.datepicker("getDate"), to.datepicker("getDate")) + " days.");
      }
    }),
    to = $("#datepicker2").datepicker()
    .on("change", function() {
      from.datepicker("option", "maxDate", gD($(this)));
      if (from.datepicker("getDate") !== null && to.datepicker("getDate") !== null) {
        $("#results").html("You selected " + dateDifference(from.datepicker("getDate"), to.datepicker("getDate")) + " days.");
      }
    });

  function gD($el) {
    return $.datepicker.parseDate(dF, $el.val()) || null;
  }

  function dateDifference(start, end) {
    var d1 = new Date(start);
    var d2 = new Date(end);
    return Math.round(Math.abs((d2 - d1) / 86400000));
  }
});
Twisty
  • 30,304
  • 2
  • 26
  • 45