Javascript 当选中同一GridView中的复选框时,如何启用和禁用GridView中的LinkButton?
我的GridView中有许多模板字段。在其中,我有一个复选框称为“chkSelect”,在另一个模板字段中,我有一个链接按钮称为“lnkgvQCAttribute”。在这里,我想在复选框未选中时禁用LinkButton,并在复选框选中时启用LinkButton。如何使用JavaScript实现这一点 以下是我的GridView列:Javascript 当选中同一GridView中的复选框时,如何启用和禁用GridView中的LinkButton?,javascript,.net,asp.net,gridview,itemtemplate,Javascript,.net,Asp.net,Gridview,Itemtemplate,我的GridView中有许多模板字段。在其中,我有一个复选框称为“chkSelect”,在另一个模板字段中,我有一个链接按钮称为“lnkgvQCAttribute”。在这里,我想在复选框未选中时禁用LinkButton,并在复选框选中时启用LinkButton。如何使用JavaScript实现这一点 以下是我的GridView列: <Columns> <asp:TemplateField HeaderText="S.No."> <ItemTe
<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的引用(下载并将其放在一个站点文件夹中,例如脚本):
享受吧 首先添加对jQuery的引用(下载并将其放入一个站点文件夹,例如脚本):
享受吧 调用复选框上的onclick=“disableLinkButton(this)”
function disableLinkButton(obj) {
var rowObject = getParentRow(obj);
if(obj.checked) {
rowObject.childNodes[3].disabled = true // debug and check, row Object will contain that link button as its childnodes
}
else {
rowObject.childNodes[3].disabled = false;
}
}
function getParentRow(obj) {
obj = obj.parentElement;
while(obj.tagName != "TR")
return obj;
}
在复选框上调用onclick=“disableLinkButton(this)”
function disableLinkButton(obj) {
var rowObject = getParentRow(obj);
if(obj.checked) {
rowObject.childNodes[3].disabled = true // debug and check, row Object will contain that link button as its childnodes
}
else {
rowObject.childNodes[3].disabled = false;
}
}
function getParentRow(obj) {
obj = obj.parentElement;
while(obj.tagName != "TR")
return obj;
}
在页面上添加以下javascript和样式:
<script type="text/javascript">
$(function () {
$("input[id*='chkSelect_']", "#<%= GridView1.ClientID %>")
.click(function () {
var linkButton = $(this).closest("tr").find("a[id*='lnkgvQCAttribute_']");
if (this.checked) {
EnableLinkButton(linkButton);
}
else {
DisableLinkButton(linkButton);
}
}) //disable turned off linkbuttons on page load
.not(":checked").each(function () {
DisableLinkButton($(this).closest("tr").find("a[id*='lnkgvQCAttribute_']"));
});
});
function EnableLinkButton(lb) {
$(lb)
.removeClass("disabled")
.attr("href", function () {
return !$(this).is("[href^='javascript:__doPostBack']") ? this.href.replace('retun false;', '__doPostBack') : this.href;
});
}
function DisableLinkButton(lb) {
$(lb)
.addClass("disabled")
.attr("href", function () { return $(this).is("[href^='javascript:__doPostBack']") ? this.href.replace('__doPostBack', 'retun false;') : this.href; });
}
</script>
<style type="text/css">
a.disabled
{
color: #e3e3e3;
text-decoration: none;
cursor: default;
}
</style>
$(函数(){
$(“输入[id*='chkSelect_'],“#”)
。单击(函数(){
var linkButton=$(this).closest(“tr”).find(“a[id*='lnkgvqctattribute_']);
如果(选中此项){
启用链接按钮(链接按钮);
}
否则{
禁用链接按钮(链接按钮);
}
})//禁用页面加载时关闭的链接按钮
.not(“:checked”)。每个(函数(){
DisableLinkButton($(this).closest(“tr”).find(“a[id*='lnkgvQCAttribute_']);
});
});
功能启用链接按钮(lb){
美元(磅)
.removeClass(“禁用”)
.attr(“href”,函数(){
return!$(this).is(“[href^='javascript:_-doPostBack']”)this.href.replace('retun false;','_-doPostBack'):this.href;
});
}
功能禁用链接按钮(lb){
美元(磅)
.addClass(“已禁用”)
.attr(“href”,function(){return$(this).is(“[href^='javascript:\uuuu doPostBack']”)?this.href.replace(“\uu doPostBack”,“retun false;”):this.href;});
}
a、 残废
{
颜色:#E3;
文字装饰:无;
游标:默认值;
}
在页面上添加以下javascript和样式:
<script type="text/javascript">
$(function () {
$("input[id*='chkSelect_']", "#<%= GridView1.ClientID %>")
.click(function () {
var linkButton = $(this).closest("tr").find("a[id*='lnkgvQCAttribute_']");
if (this.checked) {
EnableLinkButton(linkButton);
}
else {
DisableLinkButton(linkButton);
}
}) //disable turned off linkbuttons on page load
.not(":checked").each(function () {
DisableLinkButton($(this).closest("tr").find("a[id*='lnkgvQCAttribute_']"));
});
});
function EnableLinkButton(lb) {
$(lb)
.removeClass("disabled")
.attr("href", function () {
return !$(this).is("[href^='javascript:__doPostBack']") ? this.href.replace('retun false;', '__doPostBack') : this.href;
});
}
function DisableLinkButton(lb) {
$(lb)
.addClass("disabled")
.attr("href", function () { return $(this).is("[href^='javascript:__doPostBack']") ? this.href.replace('__doPostBack', 'retun false;') : this.href; });
}
</script>
<style type="text/css">
a.disabled
{
color: #e3e3e3;
text-decoration: none;
cursor: default;
}
</style>
$(函数(){
$(“输入[id*='chkSelect_'],“#”)
。单击(函数(){
var linkButton=$(this).closest(“tr”).find(“a[id*='lnkgvqctattribute_']);
如果(选中此项){
启用链接按钮(链接按钮);
}
否则{
禁用链接按钮(链接按钮);
}
})//禁用页面加载时关闭的链接按钮
.not(“:checked”)。每个(函数(){
DisableLinkButton($(this).closest(“tr”).find(“a[id*='lnkgvQCAttribute_']);
});
});
功能启用链接按钮(lb){
美元(磅)
.removeClass(“禁用”)
.attr(“href”,函数(){
return!$(this).is(“[href^='javascript:_-doPostBack']”)this.href.replace('retun false;','_-doPostBack'):this.href;
});
}
功能禁用链接按钮(lb){
美元(磅)
.addClass(“已禁用”)
.attr(“href”,function(){return$(this).is(“[href^='javascript:\uuuu doPostBack']”)?this.href.replace(“\uu doPostBack”,“retun false;”):this.href;});
}
a、 残废
{
颜色:#E3;
文字装饰:无;
游标:默认值;
}
非常感谢Javad。我现在对JQuery有了一些想法。我也对你的答案投了赞成票……非常感谢你。我现在对JQuery有了一些想法。我也对你的答案投了赞成票…谢谢。。我以为你问的是纯javascript。。否则将编写jQuery:)在ASP.NET中,我们不能为复选框调用onclick=“disableLinkButton(this)”
,因为它将呈现一个保存“input”的span
(默认情况下),并且单击将附加到span
而不是输入。谢谢。。我以为你问的是纯javascript。。否则将编写jQuery:)在ASP.NET中,我们不能为复选框调用onclick=“disableLinkButton(this)”
,因为它将呈现为一个包含“输入”的span
(默认情况下),并且单击将附加到span
而不是输入。谢谢。我从你那里学到了一些新东西。我对你的答案投了赞成票…谢谢你,尤里。我从你那里学到了一些新东西。我对你的答案投了赞成票。。。
function disableLinkButton(obj) {
var rowObject = getParentRow(obj);
if(obj.checked) {
rowObject.childNodes[3].disabled = true // debug and check, row Object will contain that link button as its childnodes
}
else {
rowObject.childNodes[3].disabled = false;
}
}
function getParentRow(obj) {
obj = obj.parentElement;
while(obj.tagName != "TR")
return obj;
}
<script type="text/javascript">
$(function () {
$("input[id*='chkSelect_']", "#<%= GridView1.ClientID %>")
.click(function () {
var linkButton = $(this).closest("tr").find("a[id*='lnkgvQCAttribute_']");
if (this.checked) {
EnableLinkButton(linkButton);
}
else {
DisableLinkButton(linkButton);
}
}) //disable turned off linkbuttons on page load
.not(":checked").each(function () {
DisableLinkButton($(this).closest("tr").find("a[id*='lnkgvQCAttribute_']"));
});
});
function EnableLinkButton(lb) {
$(lb)
.removeClass("disabled")
.attr("href", function () {
return !$(this).is("[href^='javascript:__doPostBack']") ? this.href.replace('retun false;', '__doPostBack') : this.href;
});
}
function DisableLinkButton(lb) {
$(lb)
.addClass("disabled")
.attr("href", function () { return $(this).is("[href^='javascript:__doPostBack']") ? this.href.replace('__doPostBack', 'retun false;') : this.href; });
}
</script>
<style type="text/css">
a.disabled
{
color: #e3e3e3;
text-decoration: none;
cursor: default;
}
</style>