Monday, December 11, 2023
 Popular · Latest · Hot · Upcoming
rated 0 times [  33] [ 6]  / answers: 1 / hits: 46554  / 15 Years ago, wed, february 25, 2009, 12:00:00

This seems to be a simple problem, but I dont use alot of javascript.

I have a div, with a checkbox in it, and would like the whole div to toggle the checkbox. This is what I have so far:

<div style=padding: 2em; border: 1px solid
onClick=if (document.getElementById('cb').checked) document.getElementById('cb').checked=false; else document.getElementById('cb').checked=true;>
<input name=cb id=cb type=checkbox>

Only problem is when you click the actual checkbox, it get toggled twice, and therefore doesn't change.

Any ideas?

More From » html


It's possible you could implement this in a more robust and accessible way by using the label element to wrap the area you want to click.

For example:

<label for=cb>
<div style=padding: 2em; border: 1px solid>
<input name=cb id=cb type=checkbox>

I haven't tested the above code, but I believe all browsers support clicking of labels to check an input box.

[#99934] Tuesday, February 17, 2009, 15 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.

Total Points: 144
Total Questions: 112
Total Answers: 107

Location: Ghana
Member since Mon, Aug 22, 2022
1 Year ago