Disabling checkbox in IE7

I have two checkboxes in a form and if the first checkbox is checked, the second should be enabled, and if the first is unchecked the second should be disabled. I made a quick function to handle this:

function toggleElement(sender, receiver)
{
    var sendEl = document.getElementById(sender);
    var recEl = documen开发者_C百科t.getElementById(receiver);
    if (sendEl.checked)
        recEl.disabled = false;
    else
        recEl.disabled = 'disabled';
}

This works fine in FF and IE 8/9 but doesn't do anything in IE7, I added the following to see what was happening:

alert(receiver);
alert(recEl);
alert(recEl.disabled);

In the browsers that work (FF, IE8+) these alert 'name', '[object]', and 'true' if disabled 'false' if not. In IE7 the alerts are fired but say 'name', '[object]', and 'true' even though the checkbox is never disabled (it does not get greyed out and I can continue to click it)

Any ideas why it isn't working in IE7?

When you're manipulating the DOM, the disabled property should be set to true or false, not a string. What happens if you replace 'disabled' with true?

Also you might simplify the logic to

recEl.disabled = !sendEl.checked;

This is very basic stuff in JavaScript; even IE shouldn't be having a problem with it.

disabled is a boolean attribute. Use false and true, instead of false and "disabled". It should work.

Thw whole disabled="disabled" thing in HTML markup was because of XHTML validators, not because the value is allowed to be the string "disabled". Actually, if you apply this pattern to the HTML5 required attribute, you'll get required fields even if you say required="false". The way to do it in HTML5 markup is to specify required when true, and not specify it at all when false.