Enabling/Disabling ASP.NET Checkbox in client side via JavaScript

If you are wondering why you cannot disable and enable a simple asp.net checkbox in IE using simple script like this...

function ToggleEnableCheckbox(checkboxObj)
{

checkboxObj.disabled = !checkboxObj.disabled;
}





Well the answer is because IE goes one level up and also adds a span which wraps the input checkbox.

<span disabled="disabled">
<input id="myCheckbox" disabled="disabled" type="checkbox">
</span>




To make it work in IE you also need to update the parent node node.

function ToggleEnableCheckbox(checkboxObj)
{

checkboxObj.disable = !checkboxObj.disable;
checkboxObj.parenNode.disabled = !checkboxObj.parenNode.disabled;
}





This was a pain in the beginning until I looked at the output html source of the page. First procedure works fine in FireFox but IE adds the disabled attribute to the span, therefore you have to compile for both browsers.

I hope this helpful.

The next step is to create your own checkbox list control that inherits from the ASP.NET Checkbox List and override the source writing for better simplicity.

Good Luck!