2

I have an HTML form with two disabled checkboxes and and image with an onclick event that needs to show a popup and enable the checkboxes:

<input id="chk1" type="checkbox" disabled="disabled" />
<input id="chk2" type="checkbox" disabled="disabled" />
<img src="..." onclick="window.open('...'); document.getElementById('chk1').disabled=false;document.getElementById('chk2').disabled=false" />

except it doesn't work. The popup window opens, but the checkboxes never enable.

Instead of disabled=false I've tried removeAttribute("disabled") with no luck. I also placed the window.open as the last statement in the onclick with no change.

jQuery is not in this project (yet) so I can't use it. What am I doing wrong?

Edit:

When I posted this, I failed to disclose the input tags are being rendered by ASP.NET. Through testing we've discovered there's a difference between using <asp:CheckBox /> and <input type="checkbox" runat="server" /> that affects how the disabled property behaves in IE and FF.

I've been under the impression that the final output would be the same, but apparently not, though I haven't been able to spot the difference. The rendered code as represented above works in FF but not IE when using an CheckBox object, but works in both when using an HtmlInputCheckBox object.

(I should also point out that the getElementById calls are actually using the ASP.NET ClientID property for the respective elements.)

My question now, then, is why is this the case? Why does the enable/disable functionality work in both IE and FF when using a HtmlInputCheckBox object but not for a CheckBox object?

H.B.
  • 166,899
  • 29
  • 327
  • 400
Michael Itzoe
  • 1,949
  • 4
  • 29
  • 49
  • It works for me... http://jsfiddle.net/rGMa9/ – tskuzzy Jul 29 '11 at 17:10
  • @Michael - What browser are you using? I was able to pretty much copy/paste your code into IE with no problems.... – Brian Jul 29 '11 at 17:10
  • Your code works for me in Google Chrome. – Alnitak Jul 29 '11 at 17:11
  • IE8. Fortunately(?) this is for an intranet app where we can dictate the browser. – Michael Itzoe Jul 29 '11 at 19:03
  • I just wanted to write what others have implied in their solutions below. If you use a `` and disable it on the server, the `` that wraps it is also marked as disabled. IE has trouble with this while FF & Chrome ignore it. The only thing you need to do is `checkbox.parentNode.removeAttribute('disabled');` – Mark Dornian Oct 08 '15 at 17:17

6 Answers6

2

Try with this,

inputElement.removeAttribute( 'disabled' );
inputElement.closest('span').removeAttribute( 'disabled' );
KV Prajapati
  • 93,659
  • 19
  • 148
  • 186
Sravandhi
  • 21
  • 2
2

I just found the solution. It works for me !

var checkBox = document.getElementById('" + chkBox.ClientID + "');
checkBox.removeAttribute('disabled');
checkBox.parentNode.removeAttribute('disabled');
davidlebr1
  • 423
  • 2
  • 6
  • 16
0

First check your network, second here is a link, a nice function to use for you

Checkbox Disable/Enable JS Function

Grigor
  • 4,139
  • 10
  • 41
  • 79
0

To enable a checkbox, I generally apply both of the following:

inputElement.disabled = false;
inputElement.removeAttribute( 'disabled' );

Some browsers like the DOM node property, others want the attr adjusted.

I apologize if this is what you said you were doing which was not working--I wasn't quite clear on what you were saying.

JAAulde
  • 19,250
  • 5
  • 52
  • 63
0

Try doing this:

document.getElementById('chk1').getAttribute("disabled") = false;
lazoDev
  • 349
  • 1
  • 4
  • 19
-2

In fact, you do the oppisite to enable your checkbox. Try these...

document.formname.chkname.disabled='';
toopay
  • 1,635
  • 11
  • 18