How to get a number value from an input field?

by

You had some mistakes in your HTML, but here is a working JSFiddle: Fiddle

You you are trying to get elements by their ID, but you don’t give them an ID you give them a Name. Also, stop using inline JavaScript calls; it is bad practice.

function Calculate() {
    var TotalProductionTime = document.getElementById("TotalProductionTime").value;
    var TotalProductionTimeInMinutes = TotalProductionTime * 60;
    var Breaks = document.getElementById("Breaks").value;
    var Malfunctions = document.getElementById("Malfunctions").value;
    var TheoreticalProductionTime = TotalProductionTimeInMinutes - Breaks - Malfunctions;

    document.getElementById("test").innerHTML = TheoreticalProductionTime;
}
<form id="frm1" action="Calculate.html">
    <table width="350px" border="1px">
        <tr>
            <th colspan="2">Availability</th>
        </tr>
        <tr>
            <td>Total Production Time</td>
            <td>
                <input type="number" id="TotalProductionTime" placeholder="">hours</td>
        </tr>
        <tr>
            <td>Breaks</td>
            <td>
                <input type="number" id="Breaks" placeholder="">minutes</td>
        </tr>
        <tr>
            <td>Malfunctions</td>
            <td>
                <input type="number" id="Malfunctions" placeholder="">minutes</td>
        </tr>
        <tr>
            <td>Theoretical production time:</td>
            <td>
                <p id="test"></p>
            </td>
        </tr>
    </table>
    <input type="button" onclick="Calculate()" value="calculate">
</form>

More Related Contents:

  1. How to display file name for custom styled input file using jquery?
  2. Double digit 30 seconds countdown
  3. jQuery Mobile: document ready vs. page events
  4. Using HTML5/Canvas/JavaScript to take in-browser screenshots
  5. jQuery Mobile: Markup Enhancement of dynamically added content
  6. What’s the effect of adding ‘return false’ to a click event listener?
  7. Custom attributes – Yea or nay?
  8. Connecting to TCP Socket from browser using javascript
  9. How do I get query string value from script path?
  10. Attach an event in a child iframe to a handler in the parent window
  11. Difference between Element.value and Element.getAttribute(“value”)
  12. FormData.append(“key”, “value”) is not working
  13. How do I rotate a single object on an html 5 canvas?
  14. issue with comparing two numbers in javascript
  15. JavaScript Loading Screen while page loads
  16. Materialize CSS – Select Doesn’t Seem to Render
  17. How send a form with Javascript when input name is “submit”?
  18. Class methods as event handlers in JavaScript?
  19. Safe value must use [property]=binding after bypass security with DomSanitizer
  20. How to determine if user selected a file for file upload?
  21. Drawing arrows on an HTML page to visualize semantic links between textual spans
  22. Remove scrollbar but not scrolling functionality [duplicate]
  23. How can I get DPI from image in JS?
  24. How to get an element by its href in jquery?
  25. Keep tabbing within modal pane only
  26. No sound on iOS 6 Web Audio API
  27. How to bind img src to data in Vue
  28. JavaScript form submit WITH a field called submit
  29. Why is iframe.contentWindow == null?
  30. find words in html page with javascript

Leave a Comment