How to make html form output show decimal numbers?

user_15825806 0
Viewed 44

I'm having trouble understanding how to make this html form work appropriately. The objective is for the sum of numbers to show as the result using decimal points. Currently its just showing the result in whole numbers which is making the result incorrect. I would appreciate any help, Thanks!

<form action="/action_page.php" oninput="x.value=parseInt(a.value)+parseInt(b.value)+parseInt(c.value)+parseInt(d.value)+parseInt(e.value)+parseInt(f.value)">
  <label for="quantity" style="color:white;">Easy Mode:</label>
  <br><br> 1
  <input type="number" id="a" name="quantity" min="0" max="4" step="0.5"> 2
  <input type="number" id="b" name="quantity" min="0" max="4" step="0.5"> 3
  <input type="number" id="c" name="quantity" min="0" max="4" step="0.5"> 4
  <input type="number" id="d" name="quantity" min="0" max="4" step="0.5"> 5
  <input type="number" id="e" name="quantity" min="0" max="4" step="0.5"> 6
  <input type="number" id="f" name="quantity" min="0" max="4" step="0.5"> =
  <input type="submit" value="Submit">
  <output name="x" for="a b c d e f" style="color:white;" ></output>
</form>

forms html
2 Answers

You're using parseInt which converts the numbers to an integer. Use parseFloat instead.

user_88915250

Nice work I think that you should remove all the "parseInt()" from your code, just it

<form action="/action_page.php" oninput="x.value=(a.value)+(b.value)+(c.value)+(d.value)+(e.value)+(f.value)">
    <label for="quantity" style="color:white;">Easy Mode:</label>
    <br><br> 1
    <input type="number" id="a" name="quantity" min="0" max="4" step="0.5"> 2
    <input type="number" id="b" name="quantity" min="0" max="4" step="0.5"> 3
    <input type="number" id="c" name="quantity" min="0" max="4" step="0.5"> 4
    <input type="number" id="d" name="quantity" min="0" max="4" step="0.5"> 5
    <input type="number" id="e" name="quantity" min="0" max="4" step="0.5"> 6
    <input type="number" id="f" name="quantity" min="0" max="4" step="0.5"> =
    <input type="submit" value="Submit">
    <output name="x" for="a b c d e f" style="color:white;"></output>
</form>
user_110226370
Related