Date Difference Between Two Dates in Jquery Datepicker
Here this blog about the Date Difference Between Two Dates in Jquery Datepicker, I found some time we need the no of days between two dates in date pickers.
[SOLVED] here is the solution.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 | <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <script type="text/javascript"> $( function() { var dateToday = new Date(); var dateFormat = "mm/dd/yy"; beginDate = $( "#booking_from_date" ) .datepicker({ changeMonth: true, minDate:dateToday }) .on( "change", function() { endDate.datepicker( "option", "minDate", getDate( this ) ); calcDiff(); }), endDate = $( "#booking_to_date" ).datepicker({ changeMonth: true, minDate:dateToday }) .on( "change", function() { beginDate.datepicker( "option", "maxDate", getDate( this ) ); calcDiff(); }); function getDate( element ) { var date; try { date = $.datepicker.parseDate( dateFormat, element.value ); } catch( error ) { date = null; } return date; } function calcDiff() { var d1 = $('#booking_from_date').datepicker('getDate'); var d2 = $('#booking_to_date').datepicker('getDate'); var diff = 0; if (d1 && d2) { diff = Math.floor((d2.getTime() - d1.getTime()) / 86400000); // ms per day } // var nodays = $('#calculated').val(diff); alert(diff); } } ); </script> |
HTML
1 2 3 | <input type="text" id="booking_from_date" name="booking_from_date" value="" class="form-control" required> <input type="text" id="booking_to_date" name="booking_to_date" value="" class="form-control" required> |