0
두 개의 체크 박스 목록이 있습니다. 같은 값. 이미 jQuery 코드가 Check All 체크 박스에서 작동하고 있습니다. 나는 jQuery/JavaScript에 익숙하지 않아 온라인상에서 코드를 작성하고 코드로 작업 할 수 있도록 편집했다.jQuery - 두 개의 개별 체크 박스 목록; 하나 또는 둘 모두에서 하나의 항목을 확인하십시오. 두 가지 모두는 아니지만
그러나 하나의 확인란 목록에서 항목을 선택하면 다른 확인란 목록의 동일한 항목이 자동으로 선택 취소되도록 코드를 가져와야합니다. 그 반대. 고려
감사합니다 ..
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_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>
<title></title>
<style type="text/css">
body
{
font-family: Arial;
font-size:10pt;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$("[id*=chkStockAll]").bind("click", function() {
if ($(this).is(":checked")) {
$("[id*=chkStockFruits] input").attr("checked", "checked");
$("[id*=chkOrderAll]").removeAttr("checked");
$("[id*=chkOrderFruits] input").removeAttr("checked");
} else {
$("[id*=chkStockFruits] input").removeAttr("checked");
}
});
$("[id*=chkStockFruits] input").bind("click", function() {
if ($("[id*=chkStockFruits] input:checked").length == $("[id*=chkStockFruits] input").length) {
$("[id*=chkStockAll]").attr("checked", "checked");
} else {
$("[id*=chkStockAll]").removeAttr("checked");
}
});
});
</script>
<script type="text/javascript">
$(function() {
$("[id*=chkOrderAll]").bind("click", function() {
if ($(this).is(":checked")) {
$("[id*=chkOrderFruits] input").attr("checked", "checked");
$("[id*=chkStockAll]").removeAttr("checked");
$("[id*=chkStockFruits] input").removeAttr("checked");
} else {
$("[id*=chkOrderFruits] input").removeAttr("checked");
}
});
$("[id*=chkOrderFruits] input").bind("click", function() {
if ($("[id*=chkOrderFruits] input:checked").length == $("[id*=chkOrderFruits] input").length) {
$("[id*=chkOrderAll]").attr("checked", "checked");
} else {
$("[id*=chkOrderAll]").removeAttr("checked");
}
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:CheckBox ID="chkStockAll" Text="Select Stock All" runat="server" />
<asp:CheckBoxList ID="chkStockFruits" runat="server">
<asp:ListItem Text="Mango" />
<asp:ListItem Text="Apple" />
<asp:ListItem Text="Banana" />
<asp:ListItem Text="Pineapple" />
<asp:ListItem Text="Guava" />
<asp:ListItem Text="Grapes" />
<asp:ListItem Text="Papaya" />
</asp:CheckBoxList>
<br/>
<br/>
<asp:CheckBox ID="chkOrderAll" Text="Select Order All" runat="server" />
<asp:CheckBoxList ID="chkOrderFruits" runat="server">
<asp:ListItem Text="Mango" />
<asp:ListItem Text="Apple" />
<asp:ListItem Text="Banana" />
<asp:ListItem Text="Pineapple" />
<asp:ListItem Text="Guava" />
<asp:ListItem Text="Grapes" />
<asp:ListItem Text="Papaya" />
</asp:CheckBoxList>
</form>
</body>
</html>
왜 라디오 버튼을 사용하지 않습니까? – Tomer
라디오 단추는 하나의 선택된 항목 만 허용합니다. 하나의 목록에는 모든 항목이나 일부 항목을 선택하는 옵션이 필요하지만 다른 항목에는 선택 항목이 필요하지 않습니다. 최종 사용자가 하나 또는 둘 다 선택하지 않도록하는 대신에 자동으로이를 수행하는 시스템이 필요합니다. – user1424532
페이지의 출력 HTML 만 JSFiddle에 게시하고 JQuery를 분리하면 더 많은 사용자가 이에 응답 할 수 있습니다. 샘플 ASP.Net 프로젝트를 재현하는 것은 이러한 작은 문제에 지루합니다. –