FireFox Handling Of Disabled Fields

I have an HTML form with a select list and a radio button, both of which are initially set with disabled = true. At some point, these elements are enabled via JavaScript (i.e., di

Solution 1:

I was able to resolve this issue by using jQuery to set and remove the disabled attribute rather than setting it directly. I'm not sure what it does under the hood to make it work.

$(control).attr('disabled', 'disabled');
$(control).removeAttr('disabled');

Solution 2:

After breaking my head over for 4 hours, here is what worked for me:

document.getElementById(ID).disabled = true|false;                // this works only in IE
document.getElementbyId(ID).setAttribute('disabled', true|false); // This works both in IE\FF

Solution 3:

Works for me:

<select id="a" disabled="true">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</select>

<script type='text/javascript'>
document.getElementById('a').disabled=false
</script>

Solution 4:

I've been grappling with the same issue. I'm still testing but found wrapping the form element in a span/div tag and attaching onclick to the span/div (with padding) seems to work. The only remaining issue is to set the z-index to overlay the input and change it after click so it's underneath the form input (not sure if that's possible - I don't like reading docs).

    function edit(ID) {
        // need to add previous field code and set disabled to true
        document.getElementById(ID).disabled=false
        document.getElementById(ID).focus();
    }

//Begin Body Code

<form name="theform"><table><tr><td><span style="padding:5px;border:1px solid black;" onclick="edit('myId1');"><input  onclick="edit();"   disabled id="myId1" type="text"" value="Value One" /></span></td></tr></form>

//End Body Code

Solution 5:

I've always used...

document.getElementById(ID).disabled="disabled"

...and...

document.getElementById(ID).disabled=""

...instead of true/false. Have you tried that?