How do I use a HTML input box to set a JavaScript variable?

Question

I am trying to write a simple one page calculator script with user input. With my semi-lack of JS knowledge I keep running into issues. I feel like what I am doing should work and is correct but I am obviously missing something here.

I would like my HTML input box's to set the variables for my JS function. I just can not figure out what I am doing wrong here.

If I could have a nudge in the right direction I would be more than thankful.

<body>
   <input type="text" id="price"=>Price</input>
   <br>
   <input type="text" id="value"=>Value</input>
   <br>
   <button onclick="sub()">Submit</button>
</body>
<script>      
   function sub() {
           
   var value = document.getElementById("value").value;
   var price = document.getElementById("price").value;
           
   var keep = value * 0.7
   var sell = keep * 0.7
   var profit = sell / 1000 * 6 - price
   var keeprate = price / keep * 1000
   var earned = profit + price
   
   
   
   document.write("Keeping: R$ ");
   document.write(keep);
   document.write("<br>");
   document.write("1k Buy Rate: $");
   document.write(keeprate);
   document.write("<br>");
   document.write("<br>");
   document.write("Selling: R$ ");
   document.write(sell);
   document.write("<br>");
   document.write("1k Buy Rate: ");
   document.write("$6.00");
   document.write("<br>");
   document.write("<br>");
   document.write("Total Cost $");
   document.write(price)
   document.write("<br>");
   document.write("Total Return $");
   document.write(earned)
   document.write("<br>");
   document.write("Net: $");
   document.write(profit);
   }
</script>

document.write will obliterate your existing document. This is not wise. — Lee Taylor
– Lee Taylor, Commented Aug 17, 2019 at 21:11
This is temporary. I appreciate the heads up. I am formatting it into HTML — Jason Waltz
– Jason Waltz, Commented Aug 17, 2019 at 21:14
There is no such thing as </input> and you've got an extra = after your ids. — Scott Marcus
– Scott Marcus, Commented Aug 17, 2019 at 21:29

jriley88 · Accepted Answer · 2019-08-17 21:07:09Z

2

I think your main issue is your function declaration. You have no opening and closing bracket for function sub()

Add an opening and closing bracket to properly declare your function.

function sub() {

    code

}

answered Aug 17, 2019 at 21:07

jriley88

1178 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How do I use a HTML input box to set a JavaScript variable?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related