Can't set disabled=false (javascript)

Question

I have this function:

function disableDiv(divId, action){
    var divId = byId(divId);

    if(action==true){
    divId.style.display='none';
    }
    else if(action==false){
    divId.style.display='block';
    }

    var inputs = divId.getElementsByTagName("input");
    var selects = divId.getElementsByTagName("select");
    var i;

    for (i=0; i<inputs.length; i++){
        inputs[i].disabled=action;
        }

    for (i=0; i<selects.length; i++){
        selects[i].disabled=action;
        }
}

This takes a divId (id of DIV) and an action (false or true) and gets all inputs and selects inside the div, and sets their disabled attribute to either false or true.

According to Firebug, the elements inside the Div are disabled all the time. But they should be active once hitting a drop-list option... The triggering is fine so you know. I can see this function beeing called by using alert boxes, and it does in fact set the disabled=false. But the elements are still disabled.

Something to point out is that according to firebug, the disabled attribute looks like this:

    <input name="test" id="test" disabled="">

Note there is just two doublequotes... Shouldn't it say "disabled='disabled'" or "disabled=true"?

Any tips on how to troubleshoot further?

Here is how I call the function:

(category=="Cars")?disableDiv("nav_sub_cars", false):disableDiv("nav_sub_cars", true);

If you need more input, just let me know...

Thanks

Answer 1

Edited to reflect the comments.

According to the W3C the code you posted should be correct. The disabled attribute is a boolean attribute. Use of the removeAttribute() method may be helpful as well.

In my experience, you can also achieve this effect using the string values 'disabled' or ''. This may work because these values are coerced into a boolean representation when the browser encounters them.

Answer 2

try .disabled = null or .removeAttribute('disabled'). My understanding is that it's the presence or absence of the disabled attribute that governs disabledness, not its value.

Answer 3

To disable elements you need to use attribute disabled = "disabled" rather than true or false. To make it enabled again, you need to remove the disabled attribute. Modify your code like this:

for (i=0; i<inputs.length; i++){
  if (action === false) {
    inputs[i].removeAttribute('disabled');
  }
  else {
    inputs[i].setAttribute('disabled', 'disabled');
  }
}

for (i=0; i<selects.length; i++){
  if (action === false) {
    selects[i].removeAttribute('disabled');
  }
  else {
    selects[i].setAttribute('disabled', 'disabled');
  }
}

The setAttribute and removeAttribute functions are used to set and remove disabled attribute respectively.

Answer 4

More code needed. Everything looks correct, and setting the disabled property of an <input> element to a Boolean value (the correct approach) certainly works in Firefox, regardless of the presence or absence of the disabled attribute in the source HTML.