On my form I havea set of radio buttons. Here's the mark up:
<div class="optionHolder">
<p class="optionName">Format</p>
<div class="option checked">
<input type="radio" name="fileType" value="avi" />
<img src="images/avi.png" alt="" />
<label>AVI</label>
</div>
<div class="option">
<input type="radio" name="fileType" value="mov" />
<img src="images/mov.png" alt="" />
<label>MOV</label>
</div>
<div class="option">
<input type="radio" name="fileType" value="mp4" />
<img src="images/mp4.png" alt="" />
<label>MP4</label>
</div>
<div class="option">
<input type="radio" name="fileType" value="mp3" />
<img src="images/mp3.png" alt="" />
<label>MP3</label>
</div>
</div>
When the form is submitted I want to check that one of them is checked. What's the best way to go about this? I was thinking of looping through them all and making a flag to set if one of them is checked, and then check the flag after the loop and if it's false throw an error.
Any help is appreciated, cheers.
demo
http://jsfiddle.net/Vq2jB/2/