Checkbox disable

I want to keep a checkbox disabled when page loads.

below to the checkbox I want to keep a button with label “Enable” . When clicked this will enable the checkbox.

My question:

<input type=“checkbox” name=“chkbox” disabled value=“”>

<input type=“button” name=“button” value=“enable” onclick=“callMe();”>

when clicking on the button I want to write a javascript callMe() function which will enable this checkbox.

Can I write this way document.forms[0].chkbox.disable=false;

Is this the proper way to code this ?

The default method to disable a form element in HTML uses disabled attribute with a value of “disabled” so you would need…

document.getElementById(‘form’).chkbox.disabled=“disabled” :slight_smile:

Either works, I perfer true/false for readability, and it’s shorter.

Here is a quick example showing that both work:


<form action="">
<input type="checkbox" disabled="disabled" id="chkbox" />
<div onmouseover="document.getElementById('chkbox').disabled=false" 
     onmouseout="document.getElementById('chkbox').disabled='disabled'">
     HOVER me to change checkbox
</div>
</form>

Although that could work, it could be dangerous should [0] be the wrong element. Add an ID to the <form> and then do something like:


document.getElementById('form').chkbox.disabled=false;