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?

5
  • It works for me... jsfiddle.net/rGMa9 Commented Jul 29, 2011 at 17:10
  • @Michael - What browser are you using? I was able to pretty much copy/paste your code into IE with no problems.... Commented Jul 29, 2011 at 17:10
  • Your code works for me in Google Chrome. Commented Jul 29, 2011 at 17:11
  • IE8. Fortunately(?) this is for an intranet app where we can dictate the browser. Commented Jul 29, 2011 at 19:03
  • I just wanted to write what others have implied in their solutions below. If you use a <asp:CheckBox /> and disable it on the server, the <span> 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'); Commented Oct 8, 2015 at 17:17

6 Answers 6

2

Try with this,

inputElement.removeAttribute( 'disabled' );
inputElement.closest('span').removeAttribute( 'disabled' );
Sign up to request clarification or add additional context in comments.

Comments

2

I just found the solution. It works for me !

var checkBox = document.getElementById('" + chkBox.ClientID + "');
checkBox.removeAttribute('disabled');
checkBox.parentNode.removeAttribute('disabled');

Comments

0

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

Checkbox Disable/Enable JS Function

Comments

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.

Comments

0

Try doing this:

document.getElementById('chk1').getAttribute("disabled") = false;

Comments

-2

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

document.formname.chkname.disabled='';

1 Comment

Think you have to enable irony setting first.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.