Checkbox checked event (js or mootools)

Hi all,

I will appreciate some help on this problem. I’m constructing a form where I’ll have an inter-dependable fields ie: when one checkbox is checked the next text field should appear.

Was messing with this quite a bit but wasn’t able to solve it. So what I need to know is there an event on checkboxes which can fire if checked /unchecked ?

Either pure js or mootools code will do.


 <input name="myCheckbox" type="checkbox" class="check" id="myCheckbox" />

And if checked the next text field should appear:


<input type="text" size="20" name="myTextField" maxlength="80" class="textfield spec" id="myTextField" />

The again if unchecked the textfield should dissapear.

Thanx for any insight…

Use a onclick event or something on the check box and use style display none on the text box.

<input onclick=“checkChecked(this);” name=“myCheckbox” type=“checkbox” class=“check” id=“myCheckbox” />

<input style=“display:none:” type=“text” size=“20” name=“myTextField” maxlength=“80” class=“textfield spec” id=“myTextField” />

then in checkChecked() do something like this

function checkChecked(obj)
{
if(obj.checked)
{
document.getElementById(‘myTextField’).style.display = ‘’;
}
else
{
document.getElementById(‘myTextField’).style.display = ‘none’;
}
}

Its untested but you get the idea. Probably a better way with event handlers without having to use the onclick event inline.

Hey Thanks A Lot mate! This really helped me!