jeudi 12 septembre 2019

Check/Uncheck checkboxes with Javascript

I have developed a form that I have shown in the pic. The thing I want is that when I select checkbox A the checkboxes 1 and 2 should automatically selected and unselected similarly. And when I select checkbox B it should check checkboxes 3 and 4 automatically and unselect similarly. I also want another thing that checkboxes have associated price with it i.e. $20 in this case. So when the checkbox is selected its price is added in the total. for example if I select first 2 checkbox then total price should be $40. How can I do that with javascript? I know that this will be possible with javascript but I don't konw javascript for it. Thanks in advance.

<!DOCTYPE html>
<html>
<body>

<h1>Show checkboxes:</h1>
<div style="border:1px solid">
<form action="/action_page.php">
  <input type="checkbox"> A <br>
  <input type="checkbox"> B <br>

</form>
</div>

<div style="border:1px solid; margin-top:20px;">
<form action="/action_page.php">
  <input type="checkbox"> 1 &nbsp; $20 <br>
  <input type="checkbox"> 2 &nbsp; $20<br>
  <input type="checkbox"> 3 &nbsp; $20<br>
  <input type="checkbox"> 4 &nbsp; $20<br>
  <input type="checkbox"> 5 &nbsp; $20<br>
  <input type="checkbox"> 6 &nbsp; $20<br>

</form>
</div>
<br><br>
Total: 
</body>
</html>




Aucun commentaire:

Enregistrer un commentaire