Display javascript result which is result on differences between dates inside input tag

Question

I am new and learning programming languages, here I want to ask on how to place javascript result (date) into input tag html.

the result seems not appear inside the input tag.

here is the function I wrote:

function updatesum() { var d1= new Date(document.getElementById("d1").value;); var d2 = new Date(document.getElementById("d2").value;); var total = (d2.getDate() - d1.getDate()) / 30 + d2.getMonth() - d1.getMonth() + (12 * (d2.getFullYear() - d1.getFullYear())); // alert(total); document.getElementById("txtTotal").value = total; return false; }

and this is the html form:

<br> <form name="input" action="#" method="get" onsubmit="return false;" > Start date:<input class= "d1" type="text" name="d1" value="" id="d1" /> End Date:<input class="d2" type="text" name="d2" value="" id="d2" /> <br> <br> Total Month in fraction:<input type="text" name="total" value=" " id="txtTotal"/> <input type="submit" value="Submit" onclick="updatesum()"/> </form>

the result of the function should be in input form

https://jsfiddle.net/syafieqq/c8L68bjj/2/

UPDATE correct answer

http://jsfiddle.net/syafieqq/69m3LkLv/4/

Djaouad · Accepted Answer · 2017-08-26 11:12:05Z

You have a typo in your code :

<header> date format ex: 2010/11/23</header> <br> <form name="input" action="#" method="get" onsubmit="return false;" > Start date:<input class= "d1" type="text" name="d1" value="" id="d1" /> End Date:<input class="d2" type="text" name="d2" value="" id="d2" /> <br> <br> Total Month in fraction:<input type="text" name="total" value=" " id="txtTotal"/> <input type="submit" value="Submit" onclick="updatesum()"/> </form> <script> function updatesum() { var d1= new Date(document.getElementById("d1").value); // was value;); removed inner ; var d2 = new Date(document.getElementById("d2").value); // was value;); removed inner ; var total = (d2.getDate() - d1.getDate()) / 30 + d2.getMonth() - d1.getMonth() + (12 * (d2.getFullYear() - d1.getFullYear())); // alert(total); document.getElementById("txtTotal").value = total; return false; } </script>

wow, its work.. i dont realize that typo, thanks a lot... already tested in my local server,, but, i just wonder, why, in jsfiddle the result still does not appear..?
Do not write the javascript in the javascript section in jsfiddle while using html's onclick attribute, if you write it in the javascript section, use javascript's addEventListener event. If you use html's onclick, write the javascript in a script tag in the same page as the html.

Collectives™ on Stack Overflow

Display javascript result which is result on differences between dates inside input tag

1 Answer 1

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Related