0

I know how to use javascript, but i have no in depth knowledge of it. I know how I can get the date difference in days in PHP but in this case, I need javascript solution. Honestly, i don't even know if it is possible, to do this with Javascript. I guess that it is,but that is just a guess.

Here is the html that I have:

<div class="span3" id="checkin">
    <span class="text-label"><i class="icon-calendar"></i>Check In</span> 
    <input type="text" name="checkin" value="02/08/2014">
</div>

<div class="span3" id="checkout">
    <span class="text-label"><i class="icon-calendar"></i>Check Out</span>
    <input type="text" name="checkout" value="04/08/2014">
</div>

Those two fields are actually bootstrap date pickers. They always come with some default values. Now, I want when user change those two values to calculate the difference between two dates (alert or console log will do, I will find my way from there).

Problem is that I have no clue where to start and how to do that calculation. Again I guess that onchange event may be a good candidate but...I have no idea how to calculate the difference.

Any help will be deeply appreciated.

Regards, John

user2417624
  • 653
  • 10
  • 32
  • 3
    Reading about [Date](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date) might help. – Teemu Aug 01 '14 at 07:45
  • I found that link as well but there is no example of how you can get the diffreence between two dates in number of days...Thanks anyway... – user2417624 Aug 01 '14 at 07:49
  • "So here's the general premise for calculating the difference between two dates- convert both dates to a number using Date.getTime(), and subtract!" from http://www.javascriptkit.com/javatutors/datedifference.shtml – UweB Aug 01 '14 at 07:50
  • No? Just take a look at how to calculate elapsed time. Converting milliseconds to days should be trivial ... – Teemu Aug 01 '14 at 07:51

3 Answers3

2

You could first parse your string an create a JavaScript date like that:

var start = $("input[name=checkin]").val().split("/");
var end = $("input[name=checkout]").val().split("/");

var startDate = new Date(start[2], start[1]-1, start[0]);
var endDate = new Date(end[2], end[1]-1, end[0]);

Then you can simply substract the dates from each other:

endDate - startDate

That substraction will give you the time difference in milliseconds. To convert that to days, simply divide it by the number of milliseconds in a day (1000 * 60 * 60 * 24).

Now you have the difference in days. For an example, see JSFiddle.

mritz_p
  • 3,008
  • 3
  • 28
  • 40
  • Thanks...I will find my way from here on...i had no idea how to strip the / symbols and how to calculate the date...Once again, thanks for help – user2417624 Aug 01 '14 at 08:06
0
<script type="text/javascript">

//Set the two dates
today=new Date()
var christmas=new Date(today.getFullYear(), 11, 25) //Month is 0-11 in JavaScript
if (today.getMonth()==11 && today.getDate()>25) //if Christmas has passed already
christmas.setFullYear(christmas.getFullYear()+1) //calculate next year's Christmas
//Set 1 day in milliseconds
var one_day=1000*60*60*24

//Calculate difference btw the two dates, and convert to days
document.write(Math.ceil((christmas.getTime()-today.getTime())/(one_day))+
" days left until Christmas!")

This short Javascript will display the DAY difference between today (value 1) and christmas (your value 2). Ovbioulsy these can be replaced with our two values and should then work.

Example: 146 days left until Christmas!

jbutler483
  • 24,074
  • 9
  • 92
  • 145
-1
var date1 = new Date("7/11/2010");
var date2 = new Date("12/12/2010");
var timeDiff = Math.abs(date2.getTime() - date1.getTime());
var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24)); 
alert(diffDays)​;

Try this . i found it from this link

Community
  • 1
  • 1
subrat71
  • 308
  • 3
  • 15