I will be creating a list of check boxes that will be built by jQuery and JSON. The list will be a selection of groups that a message can be sent to. It could be one of more groups. This part I can figure out. The problem I am having is how do I enable the description so that when I click on the description, the checkbox is selected.
<div> <label for="group"> Select lists </label> </div> <div> <input type="checkbox" name="group" id="group" value="1" title="Main List" />Main List <input type="checkbox" name="group" id="group" value="2" title="Secondary List" />Secondary List </div>
Add checked = "checked" to the input you want selected. For XHTML the recommended way is as described. Check HTML manual and W3C to confirm. The markup posted isn't XHTML, so it's logical to use just the simple keyword attribute checked .
Clickable Checkbox LabelWithout label tags, users can't click the label to tick the checkbox. Instead, they have to click the checkbox itself. This causes users to struggle because the checkbox is a small target to hit especially for motor-impaired users.
Use a Label with for
attribute (I assigned different IDs for checkboxes) :
<div> <label for="group"> Select lists </label> </div> <div> <input type="checkbox" name="group" id="group1" value="1" title="Main List" /> <label for="group1">Main List</label> <input type="checkbox" name="group" id="group2" value="2" title="Secondary List" /> <label for="group2">Secondary List</label> </div>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With