I am trying to take a number from my html form and then multiply it with a number from my JavaScript function and displaying the result in another html input. Want I want is when the user click on the result input area then only the multiplication result shows.

<script type="text/javascript">
  function myFunction() {
    var y = document.getElementById("km").value;
    var z = 14;
    var x = y * z;
    document.getElementById("bill").innerHTML = x;


  }
<table>
<tr> 
   <td>Total Kms Run</td>
   <td><input type="text" id="km" name="km" required>
   </tr>
    <tr> 
   <td>Total Bill</td>
   <td><input type="text" id = "bill" name="bill" required onclick="myFunction()">
   </tr>
</table

I am trying to take a number from my html form and then multiply it with a number from my JavaScript function and displaying the result in another html input. Want I want is when the user click on the result input area then only the multiplication result shows.

<script type="text/javascript">
  function myFunction() {
    var y = document.getElementById("km").value;
    var z = 14;
    var x = y * z;
    document.getElementById("bill").innerHTML = x;


  }
<table>
<tr> 
   <td>Total Kms Run</td>
   <td><input type="text" id="km" name="km" required>
   </tr>
    <tr> 
   <td>Total Bill</td>
   <td><input type="text" id = "bill" name="bill" required onclick="myFunction()">
   </tr>
</table

• javascript
• jquery
• html

• You are adding numbers in code and saying as multiplying in question – Tushar Commented May 8, 2015 at 8:48
• also, should it not just be var x = y * z ? where is the Number(y) ing from? – Paul Fitzgerald Commented May 8, 2015 at 8:49

3 Answers 3

You're adding the numbers, not multiplying them :).

That aside, inputs don't have innerHTML, you need to set the value:

document.getElementById("bill").value = x;

Do Change like this

<script type="text/javascript">
  function myFunction() {

   var y = document.getElementById("km").value;
    var z = 14;
    var x = y * z;
    document.getElementById("bill").value = x;


  }</script>

You have made many syntax mistakes in html

function myFunction() {
    var y = document.getElementById("km").value;
    var z = 14;
    var x = Number(y) * Number(z);
    document.getElementById("bill").value = x;

}

<table>
   <tr> 
       <td>Total Kms Run</td>
       <td><input type="text" id="km" name="km" required ></td>
  </tr>
  <tr> 
       <td>Total Bill</td>
      <td><input type="text" id="bill" name="bill" required onclick="myFunction()"></td>
   </tr>
</table>