Javascript 复选框OnClick事件在部分页面加载(UpdatePanel)后不工作
我在ASP.Net的UpdatePanel中有一个gridview,在gridview中,每行都有一个复选框和一个按钮。如果选中该复选框,则将启用该按钮。如果复选框未选中,则按钮将被禁用。在第一个页面加载时,jquery工作正常,inspect元素中没有错误。但是,在我单击按钮(运行数据绑定事件)之后,gridview根据需要进行了更改,但是inspect中出现了一个错误,click事件不起作用 这是我的aspx代码Javascript 复选框OnClick事件在部分页面加载(UpdatePanel)后不工作,javascript,c#,jquery,asp.net,gridview,Javascript,C#,Jquery,Asp.net,Gridview,我在ASP.Net的UpdatePanel中有一个gridview,在gridview中,每行都有一个复选框和一个按钮。如果选中该复选框,则将启用该按钮。如果复选框未选中,则按钮将被禁用。在第一个页面加载时,jquery工作正常,inspect元素中没有错误。但是,在我单击按钮(运行数据绑定事件)之后,gridview根据需要进行了更改,但是inspect中出现了一个错误,click事件不起作用 这是我的aspx代码 <%@ Page Title="" Language="C#" Mas
<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPages/PopUp.Master" AutoEventWireup="true" CodeBehind="abc.aspx.cs" Inherits="HMB.Sbadmin.Web.Pages.T.abc" %>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
<script type="text/javascript">
$(document).ready(function () {
chbActionEvent();
});
function pageLoad(sender, args) {
if (args.get_isPartialLoad()) {
chbActionEvent();
}
}
function chbActionEvent() {
$('.master_grid span.UnSettled').each(function () {
var chbAction = $(this).find('input:checkbox').attr('id');
$('#' + chbAction).change(function () {
var btnSettle = $(this).closest('tr').find(':submit').attr('id');
alert(chbAction + btnSettle);
if ($(this).is(':checked')) {
$('#' + btnSettle).attr('disabled', false);
}
else {
$('#' + btnSettle).attr('disabled', true);
}
});
});
}
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<asp:UpdatePanel ID="upMain" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<div id="gridContainer">
<ul class="link_path">
<li>
<asp:Button ID="btnRefresh" runat="server" Text="Refresh" OnClick="btnRefresh_Clicked" CssClass="uiButton uiButtonConfirm" CausesValidation="false" />
</li>
</ul>
<div id="dvMain" runat="server">
<asp:gridview ID="gvMain" runat="server" AutoGenerateColumns="False"
CssClass="master_grid"
HeaderStyle-CssClass="header"
OnRowDataBound="gvMain_RowDataBound"
OnRowCommand="gvMain_RowCommand">
<Columns>
<asp:TemplateField HeaderStyle-Width="50px" ItemStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:CheckBox ID="chbAction" runat="server" CausesValidation="false" CssClass="UnSettled"/>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderStyle-Width="120px" ItemStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:Literal ID="ltrSettle" Text='<%# Eval("Settle") %>' runat="server" Visible="false"></asp:Literal>
<asp:Button ID="btnSettle" runat="server" CssClass="UnSettled uiButton uiButtonConfirm" CommandName="cmdSettle" CommandArgument='<%# DataBinder.Eval(Container, "RowIndex") %>' CausesValidation="false" Enabled="false"/><br />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:gridview>
<div>
<asp:Label ID="lblError" runat="server" ForeColor="Red"></asp:Label>
</div>
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Content>
`
但是,没有运气
请帮忙
更新1.1:
我也试过:`
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
<script type="text/javascript">
$(document).ready(function () {
chbActionEvent();
});
//function pageLoad(sender, args) {
// if (args.get_isPartialLoad()) {
// chbActionEvent();
// }
//}
function chbActionEvent() {
$('.master_grid span.UnSettled').each(function () {
var chbAction = $(this).find('input:checkbox').attr('id');
$('#' + chbAction).change(function () {
var btnSettle = $(this).closest('tr').find(':submit').attr('id');
alert(btnSettle);
if ($(this).is(':checked')) {
$('#' + btnSettle).attr('disabled', false);
}
else {
$('#' + btnSettle).attr('disabled', true);
}
});
});
}
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<script type="text/javascript">
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(chbActionEvent);
</script>
<asp:UpdatePanel ID="upMain" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<div id="gridContainer">
<ul class="link_path">
更新1.2:
已尝试使用Microsoft Visual Studio进行调试。第一次尝试时,按钮事件正常工作。但是在部分回发之后(在我第一次单击按钮之后),复选框仍然可以正常工作(inspect中有错误),但是按钮在单击时没有做任何事情
更新1.3:
BTN设置值:在部分回调后,您必须绑定您的事件。最好使用Sys.WebForms.PageRequestManager.getInstance().add_endRequest(InIEvent)代码>
请在您的页面中添加以下代码:
<script type="text/javascript">
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(chbActionEvent);
</script>
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(chbActionEvent);
有关此问题的更多详细信息,请查看。我自己找到了解决方案
问题出在sba.all.js中,对代码做了一点修改,一切正常。控制台您的btnsetle变量。.btnsetle变量始终返回正确的id,例如:MainContent\u gvMain\u btnsetle\u 1我已在更新面板之前添加了代码并删除了文档。就绪和页面加载。。但它不起作用。我应该让文档准备好还是不准备好?页面第一次加载时,它就工作了,但在部分加载之后,表正确加载,并且显示了与我的代码不同的错误Uncaught TypeError:a[b]不是一个函数。你可以查看我在回答中提到的文章。它将帮助您。仍然不工作,并得到与我的第一个代码相同的错误:(
<script type="text/javascript">
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(chbActionEvent);
</script>