Javascript: detecting if checkbox checked not working
26,651
Solution 1
the issue is that you're document.orderform
is your form and getElementById
is on document.
You can either do:
document.getElementById(x).checked
or:
document.orderform.elements[x].checked
Solution 2
Can you try to put this condition
if (document.getElementById('discountbox').checked == true)
Solution 3
Try something a bit simpler:
if (document.getElementById(x).checked)
Author by
NQQ
Updated on April 06, 2020Comments
-
NQQ about 4 years
I've dug through all the tutorials and have been pulling my hair out trying to get this to work.
The onClick fires properly, but it never makes it inside the IF loop where it checks if the checkbox has been checked.
<!DOCTYPE html> <html> <head> </head> <header> <script> function updateTotal() { document.orderform.total.value = 1*document.orderform.subtotal.value + 1*document.orderform.tax.value + 1*document.orderform.shipping.value; } **function applyDiscount(x) { if (document.orderform.getElementById(x).checked == true) { alert("Made it in if"); document.orderform.subtotal.value = .7*document.orderform.subtotal.value; updateTotal(); }** } </script> </header> <body> <section> <h1>H1 here</h1> <article> <p>Article text here</p> </article> <form name="orderform" id="orderform" method="post" action="result.php"> <label for="firstname">First Name</label> <input type="text" name="firstname" id="firstname" placeholder="Enter First Name Here" /> <br /> <label for="subtotal">Subtotal</label> <input type="text" name="subtotal" id="subtotal" value="10" onChange="updateTotal()"/> <br /> <label for="shipping">Shipping</label> <input type="text" name="shipping" id="shipping" value="2" onChange="updateTotal()"/> <br /> <label for="tax">Tax</label> <input type="text" name="tax" id="tax" value="1" onChange="updateTotal()" /> <br /> <label for="total">Total</label> <input type="text" name="total" id="total" value="13" /> <br /> <label for="discountbox">Apply 30% discount</label> <input type="checkbox" name="discountbox" id="discountbox" onClick="applyDiscount(this.id)"/> <input type="submit" name="submit" /> </form> </section> <footer> <p>Footer here</p> </footer> </body>