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 ?
The HTML parser simply doesn't interpret the inlined javascript like this.
You may do this :
<td><input type="checkbox" id="repriseCheckBox" 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%>>
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!
<input type="checkbox" value="" ng-model="t.IsPullPoint" onclick="return false;" onkeydown="return false;"><span class="cr"></span></label>
According the W3Schools you might use JavaScript for disabled checkbox.
<!-- Checkbox who determine if the other checkbox must be disabled -->
<input type="checkbox" id="checkboxDetermine">
<!-- The other checkbox conditionned by the first checkbox -->
<input type="checkbox" id="checkboxConditioned">
<!-- 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 : http://jsfiddle.net/antoinesubit/vptk0nh6/
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>
Source: Stackoverflow.com