title: Calculate data based on text box values with javascript/html
body: <p>I am trying to get the values from 3 html text fields and add them together to get the total value when the use clicks on the button. I am new to javascript and after researching online, I found an example code and implemented to my code, but it is not showing any values. Here is my code:</p>
  
  <pre><code> &lt;form name="selectVehicleForm" action="SelectVehicle"&gt;
              Car Make: &lt;input type="text" name="make" id="make" value="${Vehicles.make}" disabled&gt; &lt;br&gt;
              Car Model: &lt;input type="text" name="model" id="model" value="${Vehicles.model}" disabled&gt; &lt;br&gt;
              Car Year: &lt;input type="text" name="year" id="year" value="${Vehicles.year}" disabled&gt; &lt;br&gt;
              Car Transmission: &lt;input type="text" name="transmission" id="transmission" value="${Vehicles.transimssion}" disabled&gt; &lt;br&gt;
              Car Rate Per Mile: &lt;input type="text" name="rpm" id="rpm" value="${Vehicles.ratePerMile}" disabled&gt; &lt;br&gt;
              Car Rate: &lt;input type="text" name="rpd" id="rpd" value="${Vehicles.ratePerDay}" disabled&gt; &lt;br&gt;
              &lt;%
                  int id = (Integer) request.getAttribute("id");
              %&gt;
              &lt;input type="hidden" name="id" value="&lt;%=id%&gt;"&gt;
  
              Pick Up Date: &lt;input type="date" name="pickUpDate"&gt; &lt;br&gt;
              Return Date: &lt;input type="date" name="returnDate"&gt; &lt;br&gt;
              Total Miles: &lt;input type="text" name="totalMile" id="totalMile" placeholder="approximate"&gt; &lt;br&gt; &lt;br&gt;
  
              &lt;script&gt;
                  function totalDue(){
                      var rpm = document.getElementById("rpm").value;
                      var rpd = document.getElementById("rpd").value;
                      var totalMiles = document.getElementById("totalMile").value;
  
                      var totalDue = (rpm * totalMiles) + rpd;
                      document.getElementById("totalDue").innerHTML = totalDue;
                  }
              &lt;/script&gt;
  
              &lt;br&gt;Total Amount Due: &lt;input type="text" name="totalDue" id="totalDue"&gt; &lt;br&gt;
          &lt;/form&gt;
  
              &lt;button id="showPaymentForm" onclick="totalDue()"&gt;Billing/Payment Info&lt;/button&gt;
  </code></pre>