enable or disable checkbox in html

I want to enable or disable checkbox in table's row on basis of condition.

code -

<td><input type="checkbox" name="repriseCheckBox" disabled={checkStat == 1 ? true : false}/></td> 

if checkStat = 1, need to disable checkbox else keep it enable.

It's not working. It disabling all the checkboxes. Any suggestions ?

6 Answers

If you specify the disabled attribute then the value you give it must be disabled. (In HTML 5 you may leave off everything except the attribute value. In HTML 4 you may leave off everything except the attribute name.)

If you do not want the control to be disabled then do not specify the attribute at all.

Disabled:

<input type="checkbox" disabled> <input type="checkbox" disabled="disabled"> 

Enabled:

<input type="checkbox"> 

Invalid (but usually error recovered to be treated as disabled):

<input type="checkbox" disabled="1"> <input type="checkbox" disabled="true"> <input type="checkbox" disabled="false"> 

So, without knowing your template language, I guess you are looking for:

<td><input type="checkbox" name="repriseCheckBox" {checkStat == 1 ? disabled : }/></td> 

<input type="checkbox" value="" ng-model="t.IsPullPoint" onclick="return false;" onkeydown="return false;"><span></span></label> 

The HTML parser simply doesn't interpret the inlined javascript like this.

You may do this :

<td><input type="checkbox" name="repriseCheckBox"/></td> <script>document.getElementById("repriseCheckBox").disabled=checkStat == 1 ? true : false;</script> 

In jsp you can do it like this:

<% boolean checkboxDisabled = true; //do your logic here String checkboxState = checkboxDisabled ? "disabled" : ""; %> <input type="checkbox" <%=checkboxState%>> 

According the W3Schools you might use JavaScript for disabled checkbox.

<!-- Checkbox who determine if the other checkbox must be disabled --> <input type="checkbox"> <!-- The other checkbox conditionned by the first checkbox --> <input type="checkbox"> <!-- JS Script --> <script type="text/javascript"> // Get your checkbox who determine the condition var determine = document.getElementById("checkboxDetermine"); // Make a function who disabled or enabled your conditioned checkbox var disableCheckboxConditioned = function () { if(determine.checked) { document.getElementById("checkboxConditioned").disabled = true; } else { document.getElementById("checkboxConditioned").disabled = false; } } // On click active your function determine.onclick = disableCheckboxConditioned; disableCheckboxConditioned(); </script> 

You can see the demo working here :

I know this question is a little old but here is my solution.

 // HTML // <input type="checkbox" onClick="setcb1()"/> // <input type="checkbox" onClick="setcb2()"/> // cb1 = checkbox 1 // cb2 = checkbox 2 var cb1 = getId('cb1'), cb2 = getId('cb2'); function getId(id) { return document.getElementById(id); } function setcb1() { if(cb1.checked === true) { cb2.checked = false; cb2.disabled = "disabled"; // You have to disable the unselected checkbox } else if(cb1.checked === false) { cb2.disabled = ""; // Then enable it if there isn't one selected. } } function setcb2() { if(cb2.checked === true) { cb1.checked = false; cb1.disabled = "disabled" } else if(cb2.checked === false) { cb1.disabled = "" } 

Hope this helps!