我的 GridView 中有许多模板字段。其中我有一个名为“chkSelect”的复选框,在另一个模板字段中我有一个名为“lnkgvQCAttribute”的LinkButton。在这里,我想在未选中 CheckBox 时禁用 LinkButton,并在选中 CheckBox 时启用 LinkButton。如何使用 JavaScript 做到这一点?
这是我的 GridView 的列:
<Columns>
<asp:TemplateField HeaderText="S.No.">
<ItemTemplate>
<asp:Label ID="lblSNo" runat="server" Text='<%# Container.DataItemIndex + 1 %>'></asp:Label>
</ItemTemplate>
<ItemStyle Width="25px" />
<ControlStyle Width="25px" />
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<asp:CheckBox ID="chkSelect" runat="server" Checked='<%#Bind("Select") %>' onClick="CheckedTotal();" />
</ItemTemplate>
<HeaderTemplate>
<asp:CheckBox ID="chkSelectAll" runat="server" onclick="CheckAll();" />
</HeaderTemplate>
<ControlStyle Width="20px" />
<ItemStyle Width="20px" />
</asp:TemplateField>
<asp:BoundField DataField="PurchaseID" HeaderText="PurchaseID" Visible="false" />
<asp:BoundField DataField="POID" HeaderText="POID" Visible="false" />
<asp:BoundField DataField="PurchaseDetailID" HeaderText="PurchaseDetailID" Visible="false" />
<asp:TemplateField HeaderText="ItemID" Visible="false">
<ItemTemplate>
<asp:Label ID="lblgvItemID" runat="server" Text='<%# Bind("ItemID") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Item Description" SortExpression="ItemDescription">
<ItemTemplate>
<asp:Label ID="lblItemDesc" runat="server" Text='<%# Bind("ItemDescription") %>' Style="display: none"></asp:Label>
<asp:TextBox ID="txtItemDesc" runat="server" Text='<%# Bind("ItemDescription") %>' Font-Size="Smaller" Enabled="false"></asp:TextBox>
</ItemTemplate>
<ControlStyle Width="200px" />
<ItemStyle Width="200px" />
</asp:TemplateField>
<asp:BoundField DataField="SpecificationName" HeaderText="Specification Name" SortExpression="SpecificationName">
<ItemStyle HorizontalAlign="Left" />
</asp:BoundField>
<asp:TemplateField HeaderText="RD">
<ItemTemplate>
<asp:Label ID="lblgvRD" runat="server" Text='<%# Bind("RandomDimension") %>'></asp:Label></ItemTemplate>
<ItemStyle Width="40px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Planned Quantity" SortExpression="PlannedQuantity">
<ItemTemplate>
<asp:Label ID="lblPlannedQuantity" runat="server" Text='<%# Bind("PlannedQuantity") %>' />
<asp:TextBox ID="txtPlannedQuantity" runat="server" Style="display: none" Text='<%# Bind("PlannedQuantity") %>' />
</ItemTemplate>
<ControlStyle Width="60px" />
<ItemStyle Width="60px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="OnOrder Quantity" SortExpression="OnOrderQuantity">
<ItemTemplate>
<asp:Label ID="lblOnOrderQuantity" runat="server" Text='<%# Bind("OnOrderQuantity") %>' />
<asp:TextBox ID="txtOnOrderQuantity" runat="server" Style="display: none" Text='<%# Bind("OnOrderQuantity") %>' />
</ItemTemplate>
<ControlStyle Width="60px" />
<ItemStyle Width="60px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Order Quantity" SortExpression="OrderQuantity">
<ItemTemplate>
<asp:TextBox ID="txtOrderQuantity" runat="server" MaxLength="10" onkeypress="return DecimalValidate(event);" onkeyup="return calculateTotal();" Text='<%# Bind("OrderQuantity") %>' Enabled="false" />
</ItemTemplate>
<ControlStyle Width="60px" />
<ItemStyle Width="60px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Unit Rate" SortExpression="UnitRate">
<ItemTemplate>
<asp:Label ID="lblUnitRate" runat="server" Style="display: none" Text='<%# Bind("UnitRate") %>' />
<asp:TextBox ID="txtUnitRate" runat="server" onkeypress="return DecimalValidate(event);" onkeyup="return calculateTotal();" Text='<%# Bind("UnitRate") %>' Enabled="false />
</ItemTemplate>
<ControlStyle Width="90%" />
<ItemStyle Width="80px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Total Amount" SortExpression="TotalAmount">
<ItemTemplate>
<asp:TextBox ID="txtTotalAmt" runat="server" contentEditable="false" onclick="this.blur();" Style="background-color: Transparent; border: 0px; cursor: default" Text='<%# Bind("TotalAmount") %>' />
</ItemTemplate>
<ControlStyle Width="60px" />
<ItemStyle Width="60px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="ItemStatusID" Visible="false">
<ItemTemplate>
<asp:Label ID="lblgvItemStatusID" runat="server" Text='<%# Bind("ItemStatusID") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="QC">
<ItemTemplate>
<asp:LinkButton ID="lnkgvQCAttribute" runat="server" CommandArgument='<%# DataBinder.Eval(Container, "RowIndex") %>' CommandName="QC" Text="QC" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
我需要你所有的建议...
最佳答案
首先添加对 jQuery 的引用(下载它并将其放入站点文件夹之一,例如 Scripts):
<script src="Scripts/jquery-1.2.6.pack.js" type="text/javascript"></script>
然后您应该为您的元素创建一个 CssClass 名称,例如:
<asp:TemplateField>
<ItemTemplate>
<asp:CheckBox ID="chkSelect" runat="server" Checked='<%#Bind("Select") %>' CssClass="chkSelect" />
</ItemTemplate>
<HeaderTemplate>
<asp:CheckBox ID="chkSelectAll" runat="server" onclick="CheckAll();" />
</HeaderTemplate>
<ControlStyle Width="20px" />
<ItemStyle Width="20px" />
</asp:TemplateField>
和
<asp:TemplateField HeaderText="QC">
<ItemTemplate>
<asp:LinkButton ID="lnkgvQCAttribute" runat="server" CommandArgument='<%# DataBinder.Eval(Container, "RowIndex") %>'
CommandName="QC" Text="QC" CssClass="lnkgvQCAttribute" />
</ItemTemplate>
</asp:TemplateField>
现在,您可以使用 JS 找到您的元素并控制它们的行为。在这种情况下,复选框在 span
中,然后在 td
中,最后在 tr
中。您应该导航到 tr
,在 tr
中找到具有 lnkgvQCAttribute
类的 a 元素,并控制它:
<script type="text/javascript">
$(document).ready(function () {
$("span.chkSelect input").click(function () {
var enabled = this.checked;
var link = $(this).parent().parent().parent().find("a.lnkgvQCAttribute");
if (enabled) {
var href = $(link).attr("data-href");
$(link).attr("href", href);
$(link).removeAttr("data-href");
} else {
var href = $(link).attr("href");
$(link).attr("data-href", href);
$(link).removeAttr("href");
}
});
});
</script>
尽情享受吧!
关于javascript - 当选中同一个 GridView 中的 CheckBox 时,如何启用和禁用 GridView 中的 LinkButton?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7481064/