Enabling and disabling checkboxes through javascript for example when I check chk1 and then chk2, chk3 and chk4 will be enabled and if I uncheck chk1 then chk2, chk3 and chk4 will be disabled through javascript?
here's my code:
<script type="text/javascript">
$('chkTAR').clicked(function(){
{
if($('chkTAR :checked').length == 2)
$('chkOasis, chkPOT').disabled = true;
else
$('chkOasis, chkPOT').disabled = false
});
</script>
You can try this:
<script language="javascript" type="text/javascript">
function oncheckchange(checked) {
var chk2 = document.getElementById('chk2');
chk2.disabled = checked;
}
</script>
<asp:CheckBox OnClick="oncheckchange(this.checked);" ID="chk1" runat="server" />
<asp:CheckBox ID="chk2" runat="server" ClientIDMode="Static" />
Note that chk2's ClientIDMode is set to "Static".
This might help you Disabling/Enabling checkboxes
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication3._Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/javascript">
$().ready(function () {
$('#checkbox1, #checkbox2').click(function () {
if ($('#checkbox1:checked,#checkbox2:checked').length == 2)
$('#checkbox3, #checkbox4').attr('disabled','true');
else
$('#checkbox3, #checkbox4').attr('disabled','');
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<input type="checkbox" id="checkbox1" value="c1" />
<input type="checkbox" id="checkbox2" value="c2" />
<input type="checkbox" id="checkbox3" value="c3" />
<input type="checkbox" id="checkbox4" value="c4" />
</div>
</form>
</body>
</html>
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default6.aspx.cs" Inherits="Default6" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<script src="http://code.jquery.com/jquery-1.5.js"></script>
<script language="javascript">
function EnableDisableDIV() {
if ($("#chkShowPersonal").attr("checked")) {
$("#dvPersonal").show();
} else {
$("#dvPersonal").hide();
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:CheckBox ID="chkShowPersonal" onclick="EnableDisableDIV()" runat="server" Text="Fruits" />
<div id="dvPersonal" style="display: none">
<asp:CheckBox ID="chk1" runat="server" Text="Apple" />
<asp:CheckBox ID="chk2" runat="server" Text="Banana" />
<asp:CheckBox ID="chk3" runat="server" Text="Orange" />
</div>
</form>
</body>
</html>
