Databases
StackOverflow2013
Postsdbo
POJavascript date calculation event
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POJavascript date calculation event
    text
    copied!<p>I have the following code for a javascript calculation to calculate the different between 2 dates. I have the function on the .change event of one of the fields "conference_date_out", however, if I go back and change the "date_in" date - the calculation in "total days" does not update. what am i doing wrong?</p> <p>JavaScript:</p> <pre><code>&lt;script type="text/javascript"&gt; $(function () { $(".datepicker").datepicker({ dateFormat: 'dd-mm-yy' })({ changeMonth: true, changeYear: true }); $(".datepicker").datepicker; }); $('#conference_date_out').change(function () { var start = $('#conference_date_in').datepicker('getDate'); var end = $('#conference_date_out').datepicker('getDate'); var days = (end - start) / 1000 / 60 / 60 / 24; document.getElementById('total_days').value = days; }); &lt;/script&gt; </code></pre> <p>HTML:</p> <pre><code>&lt;title&gt;Conference Form&lt;/title&gt; &lt;script type="text/javascript" src="css/jqueryui.css"&gt;&lt;/script&gt; &lt;script type="text/javascript" src="js/jquery.js"&gt;&lt;/script&gt; &lt;script type="text/javascript" src="js/jqueryui.js"&gt;&lt;/script&gt; &lt;link href="style.css" rel="stylesheet" type="text/css" /&gt; &lt;link href="css/jqueryui.css" rel="stylesheet" type="text/css" /&gt; &lt;body&gt; &lt;div id="wrapper"&gt; &lt;div id="header"&gt;&lt;/div&gt; &lt;table width="705" border="1" align="left" cellpadding="1"&gt; &lt;form action="" method="get" name="myform"&gt; &lt;tr&gt; &lt;td width="151"&gt; &lt;label&gt;Company Name&lt;/label&gt; &lt;/td&gt; &lt;td width="158"&gt; &lt;input type="text" name="companyname" id="companyname" /&gt; &lt;/td&gt; &lt;td width="155"&gt;Enquiry Date&lt;/td&gt; &lt;td width="213"&gt; &lt;input type="text" name="enquiry_date" id="enquiry_date" /&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;&amp;nbsp;&lt;/td&gt; &lt;td&gt;&amp;nbsp;&lt;/td&gt; &lt;td&gt;&amp;nbsp;&lt;/td&gt; &lt;td&gt;&amp;nbsp;&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;Conference Date In&lt;/td&gt; &lt;td&gt; &lt;input type="text" name="conference_date_in" id="conference_date_in" class="datepicker" /&gt; &lt;/td&gt; &lt;td&gt;Conference Date Out&lt;/td&gt; &lt;td&gt; &lt;input type="text" name="conference_date_out" id="conference_date_out" class="datepicker" /&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;&amp;nbsp;&lt;/td&gt; &lt;td&gt;&amp;nbsp;&lt;/td&gt; &lt;td&gt;&amp;nbsp;&lt;/td&gt; &lt;td&gt;&amp;nbsp;&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;Number of Delegates&lt;/td&gt; &lt;td&gt; &lt;input type="text" name="no_of_delegates" id="no_of_delegates" /&gt; &lt;/td&gt; &lt;td&gt;Total Days&lt;/td&gt; &lt;td&gt; &lt;input type="text" name="total_days" id="total_days" /&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/form&gt; &lt;/table&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload