<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type = "text/javascript">
$("[id*=chkAll]").live("click", function () {
if ($(this).is(":checked")) {
$("[id*=chkFruits] input").attr("checked", "checked");
} else {
$("[id*=chkFruits] input").removeAttr("checked");
}
});
$("[id*=chkFruits] input").live("click", function () {
if ($("[id*=chkFruits] input").length == $("[id*=chkFruits] input:checked").length) {
$("[id*=chkAll]").attr("checked", "checked");
} else {
$("[id*=chkAll]").removeAttr("checked");
}
});
</script>
</head>
<body>
<form id="form1" runat="server">
Check All: <asp:CheckBox ID="chkAll" runat="server" /><br />
<asp:CheckBoxList ID="chkFruits" runat="server">
<asp:ListItem Text="Mango" Value="1"></asp:ListItem>
<asp:ListItem Text="Apple" Value="2"></asp:ListItem>
<asp:ListItem Text="Banana" Value="3"></asp:ListItem>
<asp:ListItem Text="Pineapple" Value="4"></asp:ListItem>
<asp:ListItem Text="Orange" Value="5"></asp:ListItem>
</asp:CheckBoxList>
</form>
</body>
</html>