[英]ASP.Net GridView checkbox click update another checkbox
In my ASP.Net project I have a GridView with 2 checkboxes and other data columns. 在我的ASP.Net项目中,我有一个带有2个复选框和其他数据列的GridView。 The 2 checkboxes are like a radio button such that when 1 is checked, the other must be unchecked. 2个复选框就像一个单选按钮,因此当选中1时,必须取消选中其他复选框。 I cannot change this to a radio button due to the requirement. 由于需要,我无法将其更改为单选按钮。 How can I achieve this mutual exclusive on client side? 如何在客户端实现这种互斥?
Below is the GridView 下面是GridView
<asp:GridView ID = "gridview1" runat="server" HorizontalAlign="Left" AutoGenerateColumns="false" BackColor="White" BorderColor="#999999" BorderStyle="Solid" BorderWidth="1px" CellPadding="6" ForeColor="Black" GridLines="Vertical"> <AlternatingRowStyle BackColor = "#CCCCCC" /> < FooterStyle BackColor="#CCCCCC" /> <HeaderStyle BackColor = "Black" Font-Bold="True" ForeColor="White" /> <Columns> <asp:TemplateField HeaderText = "Yes" ItemStyle-HorizontalAlign="Center"> <ItemTemplate> <asp:CheckBox ID = "checkbox1" runat="server"/> </ItemTemplate> <ItemStyle HorizontalAlign = "Center" ></ ItemStyle > </ asp:TemplateField> <asp:TemplateField HeaderText = "No" ItemStyle-HorizontalAlign="Center"> <ItemTemplate> <asp:CheckBox ID = "checkbox2" runat="server" /> </ItemTemplate> <ItemStyle HorizontalAlign = "Center" ></ ItemStyle > </ asp:TemplateField> <asp:TemplateField HeaderText = "Account" ItemStyle-HorizontalAlign="Right" > <ItemTemplate> <asp:Label runat = "server" Text='<%#Eval("Account") %>'></asp:Label> </ItemTemplate> <ItemStyle HorizontalAlign = "Right" ></ ItemStyle > </ asp:TemplateField> <asp:TemplateField HeaderText = "REL" ItemStyle-HorizontalAlign="Right"> <ItemTemplate> <asp:Label runat = "server" Text='<%Eval("Relation") %>' ID="RelPosTypeLabel"></asp:Label> </ItemTemplate> <ItemStyle HorizontalAlign = "Right" ></ ItemStyle > </ asp:TemplateField> </Columns> </asp:GridView>
Here a snippet that will work for you. 这是适合您的代码段。
<script type="text/javascript">
$("#<%= GridView1.ClientID %> tr input:checkbox").change(function () {
var rowIndex = parseInt(this.id.split("_")[2]);
switchCheckBoxes(rowIndex + 1);
this.checked = true;
});
function switchCheckBoxes(rowIndex) {
$("#<%= GridView1.ClientID %> tr").each(function (index, element) {
if (index == rowIndex) {
$(this).find("td input:checkbox").each(function () {
this.checked = false;
});
}
});
}
</script>
And remove all those extra spaces, it will improve readability ID = "gridview1"
> ID="gridview1"
并删除所有这些多余的空格,将提高可读性ID = "gridview1"
> ID="gridview1"
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.