How to enable the submit button in my HTML form and disable if checkbox was unchecked?
What is wrong with this code?
EnableSubmit = function(val)
{
var sbmt = document.getElementById("Accept");
if (val.checked == true)
{
sbmt.disabled = false;
}
else
{
sbmt.disabled = true;
}
}
The check box
<td width="30%">Do you accept Terms of Service agreement?</td>
<td width="10px" style="min-width: 10px"></td>
<td width="70%">
<input type="checkbox" name="TOS" value="Accept" onClick="EnableSubmit"> I agree to Terms of Service agreement.
</td>
Change your HTML to this:
<td width="30%">Do you accept Terms of Service agreement?</td>
<td width="10px" style="min-width: 10px"></td>
<td width="70%">
<input type="checkbox" name="TOS" value="Accept" onClick="EnableSubmit(this)"> I agree to Terms of Service agreement.
</td>
Reason it's not working: you're not passing your function anything. Actually, because you've not used parentheses with the function name, you've not called the function at all. Passing it this
in the context of the onclick
HTML event attribute means you're passing a reference to the element's DOM object, giving you access to its checked
property.
You need to include the parameters: onClick="EnableSubmit()"
<input type="checkbox" name="TOS" value="Accept" onClick="EnableSubmit()"> I agree to Terms of Service agreement.
First if condition checks whether toggle is switched to desired side. Condition can be changed according to requirement.
Last jquery is to make toggle button grey.
if(!$('#togglehk').is(":checked"))
{
$('#togglehk').click();
}
jQuery('#togglehk').attr("disabled", true);
jQuery('#togglehk').prop("disabled",true);
jQuery('#togglehk').next(".slider").css("backgroundcolor","#B3B3B3");