jeudi 15 août 2019

Complex selection and deselection of checkboxes using jquery or javascript

I have a form which contains set of checkboxes for three different sections seperated by radiobox selection. Here I want to achieve two things:

  1. When a user wants to select a section he/she click on the radio button and the repective section should be shown which contains checkboxes inside a DIV.

  2. Now, again when user clicks on another radio button I want the checkboxes from the previous section should be unchecked and vice versa.

Please guys help me with some javascript code so I can proceed with my work.

<input type="radio" value="fruit" id="fruit" checked="checked" />Favorite fruit?<br/>
<input type="radio" id="color" value="color" />Favorite color?<br/>
<input type="radio" id="sport" value="sport" />Favorite sport?<br/>

<div id="fruit">
  <input type="checkbox" value="apple"> Apple<br/>
  <input type="checkbox" value="apple"> Banana<br/>
  <input type="checkbox" value="apple"> Mango<br/>
</div>

<div id="color">
  <input type="checkbox" value="black"> Black<br/>
  <input type="checkbox" value="orange"> Orange<br/>
  <input type="checkbox" value="blue"> Blue<br/>
</div>

<div id="sport">
  <input type="checkbox" value="boxing"> Boxing<br/>
  <input type="checkbox" value="cricket"> Cricketbr/>
  <input type="checkbox" value="football"> Football<br/>
</div>

I need a javascript or jquery code.




Aucun commentaire:

Enregistrer un commentaire