How to Input a Number that changes Total

Question

The input field does not register (discount is supposed to subtract from Grand Total)

Check the CodePen

Javascript

function recordToFilename() {
  var input = document.getElementById('discountvalue'),
  discount12 = input.value;
}

I want it to act like this picture below. (with the discount being manually inputed) https://i.sstatic.net/yV8QT.jpg

Answer 1

You can't get value of they discount because it also include text.

JS = document.getElementById('discountsample').innerHTML = " Discount Sample: $" + (-10).toFixed(2);
HTML Output = <h4 id="discountsample"> Discount Sample: $-10.00</h4>

Add the value in a attribute like price so the output will be like

<h4 id="discountsample" price="10.00"> Discount Sample: $-10.00</h4>

You can read the value from the price.
In your last JS you set it in that and also this way you can get the value and substract it.

  function recordToFilename() 
  {
      var input = document.getElementById('discountvalue'),

      //Something like this. This requires jQuery
      document.getElementById('discountsample').attr("price", input.value);

      //I don't know how it is in normal JS. I think its like this but you have to test it
      document.getElementById('discountsample').attributes['id'] = input.value;
  };

And also make the code cleaner like detaching the JS from the HTML and vice versa.
Now it's just all mixed up. Some in your HTML and some in your JS