ASP.Net 更新面板的噩梦。按钮无法正常触发。网页表单 C#

Question

我加载了两个链接来使用 Ajax ModalPopup 将 Comment.aspx 加载为模式弹出窗口。

一个链接是 LinkBuuton，它在 ModalPopup1 中打开相同的 Comment.aspx，另一个链接是“提交”按钮，用于发布评论，该按钮也会在另一个 Modalpopup2 中加载相同的页面。我使用 jQuery 捕获点击，并在受人尊敬的 ModalPopup 中加载 Comment.aspx 页面。

问题是，当我使用链接按钮“lnkBtnComment”打开“mpShowCommentPopUp”弹出窗口时，它工作正常并显示内联验证，没有任何问题。

但现在，如果我关闭此弹出窗口并尝试使用按钮“btnPostComment2”加载相同的 Comment.aspx，则在这种情况下按钮不会触发。

如果我刷新页面，现在我首先使用 lnkBtnComment" 打开 Comment.aspx 页面，这次它将起作用，验证将显示，没有任何问题，如果我重复步骤一，则再次按钮将不会触发。

我正在放置 中的 comment.aspx 代码

<%@ Page Title="" UICulture="Auto" Language="C#" MasterPageFile="~/SiteMaster.master" AutoEventWireup="true" CodeFile="ArticleDetails.aspx.cs" Inherits="ArticleDetails"  %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server">

    <script type="text/javascript">
        jQuery(document).ready(function () {
            $("#<%=lnkBtnEmail.ClientID %>").click(function(){
                //Load EMail Form
                $("#<%=pnlEmailArticleForm.ClientID %>").load("EmailArticle.aspx?ArticleID=<%=Request["ArticleID"] %>&Language=<%=Request["Language"] %>", function () {  });
                // $(".formErrorContent").show();             // $(".formErrorArrow").show();
            });

            //Close popup
               $("#<%= imgBtnCloseEmailPopup.ClientID %>").click(function () { $('#frmEmail').validationEngine('hideAll')
                // $(".formErrorContent").hide();             //  $(".formErrorArrow").hide();
             });


            $("#<%=btnPostComment2.ClientID %>").click(function(){
                //Load Comment Form
                $("#<%=pnlCommentForm2.ClientID %>").load("Comment.aspx?ArticleID=<%=Request["ArticleID"] %>&Language=<%=Request["Language"] %>", function () {      });
             });
            $("#<%= imgBtnClose2.ClientID %>").click(function () {  $('#frmComment').validationEngine('hideAll')  });


             $("#<%= lnkBtnComment.ClientID %>").click(function () {
                //Load Comment Form
                $("#<%=pnlCommentForm.ClientID %>").load("Comment.aspx?ArticleID=<%=Request["ArticleID"] %>&Language=<%=Request["Language"] %>", function (){       });
                });
              $("#<%= imgBtnClose.ClientID %>").click(function () {  $('#frmComment').validationEngine('hideAll')  });



         });

         //For printing
         function CallPrint() {
             window.open('PrintArticle.aspx?articleID=<%=Request["articleID"] %>', 'Email', 'width=690, height=650,left=100, top=100, location=no, menubar=no, resizable=no, scrollbars=yes, status=no, toolbar=no,fullscreen=no');
         }
         //For printing
         function CallDownload() {
             window.open('PrintArticle.aspx?articleID=<%=Request["articleID"] %>&download=yes', 'Email', 'width=690, height=650,left=100, top=100, location=no, menubar=no, resizable=no, scrollbars=no, status=no, toolbar=no,fullscreen=no');
         }
    </script>

<style type="text/css">
        .modalBackground
        {
        background-color: Gray;
        filter: alpha(opacity=80);
        opacity: 0.8;
        z-index: 10000;
        }
        .bodyClass
        {
            background: url(~/images/content_repeat.jpg) repeat-xy;
            background-color:#E5E5E5;
        }
        </style>
<script type="text/javascript" >
                function showHelloWorld() {
                    //alert('Hello World');
                    return true;
                }

                //-->
        </script>
    <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>

    <div id="container" class="container">
        <div id="TopBanner" class="TopBanner"><asp:Image ID="imgTopBanner" runat="server" /> </div>
        <div id="TopBannerBase" class="TopBannerBase" ></div>
    </div>
  <div id="bodyContainer"  class="bodyContainer">
          <table cellpadding="0" cellspacing="0"  >
                <tr>
                    <td width="35px"></td>
                    <td width="826px" valign="top">
                        <table cellpadding="0" cellspacing="0" border="0" width="826px">
                            <tr>
                                <td height="40px" width="826px" >
                                    <div class="breadcrum" >
                                        <asp:HyperLink ID="hyLkHomeNav" runat="server"  CssClass="goldNav" NavigateUrl="default.aspx"  ></asp:HyperLink> 
                                    </div>
                                    <div class="breadcrum">
                                        <asp:HyperLink ID="hyLkPageNav" runat="server" CssClass="goldNav" ></asp:HyperLink> 
                                    </div>
                                    <div class="breadcrum">
                                        <asp:HyperLink ID="hyLnkYear" runat="server" CssClass="goldNav" ></asp:HyperLink> 
                                    </div>
                                    <div class="breadcrum">
                                        <asp:HyperLink ID="hylnkArticleTitle" runat="server" CssClass="goldNav" ></asp:HyperLink> 
                                        <asp:Label ID="lblArtcleTitleNav" CssClass="navActiveCurrent" runat="server" Text=""></asp:Label>
                                    </div>
                                  <asp:TextBox ID="txtPageName" runat="server" Height="16px" Visible="False"  Width="16px"></asp:TextBox>

                                </td>
                            </tr>
                            <tr>
                            <td height="35px" width="826px">
                                <table cellpadding="0" cellspacing="0" width="826px" >
                                    <tr>
                                        <td height="400px" valign="top">

                                            <table cellpadding="0" cellspacing="0" width="100%">
                                                <tr>
                                                    <td height="30px">
                                                        <asp:Label ID="lblArticleTitle" CssClass="ArticleTitleText" runat="server" Text="" Width="100%"></asp:Label>
                                                        <div id="articlePubdate" Class="ArticlePubDate" >
                                                            <asp:Label ID="lblPublished" runat="server" Text="Published : "></asp:Label>
                                                            <asp:Label ID="lblPubDate" runat="server" Text=""></asp:Label>
                                                        </div>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td height="2px" bgcolor="#D1C094"></td>
                                                </tr>
                                                <tr>
                                                    <td style="text-align:justify" >

                                                       <div id="divArticleImage" class="divArticleImage" runat="server">
                                                           <asp:Image ID="imgArticle" CssClass="ArticleImage" runat="server" />
                                                           <div id="divArticleImageDesc" class="divArticleImageDesc" >
                                                                <asp:Label ID="lblImgDesc" runat="server" Text=""></asp:Label>
                                                           </div>
                                                            </div>
                                                       <asp:Label ID="lblArticleDetails" CssClass="PageBodyText" runat="server" Text=""></asp:Label>
                                                    </td>
                                                </tr>
                                                <tr><td >
                                                <table class="divArticleDetailsFooter"><tr><td>
                                                <!-- Article Details Section footer -->
                                                <div style="height:10px;"></div>
                                                <div id="divArticleDetailsFooter"  class="divArticleDetailsFooter">
                                                    <div id="divlblComment" class="imgTArticleDetailsFooter">
                                                    <asp:Image ID="imgComment" runat="server" ImageUrl="~/images/comment.png"  />
                                                        <asp:LinkButton ID="lnkBtnComment" runat="server" 
                                                            CssClass="divArticleDetailsFooterLabels" CausesValidation="False" 
                                                            onclick="lnkBtnComment_Click" >Comment</asp:LinkButton>

                                                    </div>
                                                    <div id="divlblEmail" class="imgTArticleDetailsFooter">
                                                    <asp:Image ID="imgEmail" runat="server" ImageUrl="~/images/email.png" />
                                                        <asp:LinkButton ID="lnkBtnEmail" runat="server"  
                                                         CssClass="divArticleDetailsFooterLabels" CausesValidation="True" 
                                                            onclick="lnkBtnEmail_Click" >Email</asp:LinkButton>
                                                    </div>
                                                    <div id="divlblPrint" class="imgTArticleDetailsFooter">
                                                    <asp:Image ID="imgPrint" runat="server" ImageUrl="~/images/print.png" />
                                                    <asp:HyperLink ID="hylPrintArticle" runat="server" CssClass="divArticleDetailsFooterLabels" OnClick="CallPrint()" NavigateUrl=""> Print</asp:HyperLink>
                                                        </div>
                                                    <div id="divlblDownload" class="imgTArticleDetailsFooter">
                                                    <asp:Image ID="imgDownload" runat="server" ImageUrl="~/images/download.png" />
                                                   <asp:HyperLink ID="hylDownloadArticle" runat="server" CssClass="divArticleDetailsFooterLabels" OnClick="CallDownload()" NavigateUrl=""> Download</asp:HyperLink>
                                                    </div>

                                                </div>  
                                                <!-- Article Details Section footer -->
                                                </td></tr></table>
                                                </td></tr>
                                                <tr>
                                                    <td height="20px" ></td>
                                                </tr>
                                                <tr>
                                                    <td height="2px" bgcolor="#D1C094"></td>
                                                </tr>
                                                <tr>
                                                    <td height="100px" >
                                                    <div id="showComments" class="showComments">
                                                        <div id="divCommentCount" class="CommentCount"><asp:Label ID="lblCommentCount" runat="server" Text="Comment"></asp:Label> </div>
                                                        <div id="divPostCommentMSG" class="PostCommentMSG"><asp:Label ID="lblPostCommentMSG" runat="server" Text="Please keep your comments relevant to this website entry. Email addresses are never displayed, but they are required to confirm your comments. Please note that gratuitous links to your site are viewed as spam and may result in removed comments."></asp:Label></div>
                                                        <div id="divPostCommentButton" class="divPostCommentButton"> 
                                                            <asp:Button ID="btnPostComment2" runat="server" CssClass="buttonPC" 
                                                                Text="Post Comment" CausesValidation="False" 
                                                                onclick="btnPostComment2_Click" /></div>
                                                        <div>Line</div>
                                                        <div>Post Date</div>
                                                        <div>Message</div>
                                                        <div>Person Name</div>
                                                        <div>line</div>

                                                    </div>

                                                     </td>
                                                </tr>
                                            </table>
                                        </td>
                                    </tr>
                                </table>

                            </td>
                            </tr>
                        </table>

                    </td>
                    <td width="39px" valign="top">
                    </td>
                </tr>
            </table>
</div>

<div>
<asp:ModalPopupExtender ID="mpShowCommentPopUp" runat="server" TargetControlID="lnkBtnComment" PopupControlID="pnlComment"
 BackgroundCssClass="modalBackground" CancelControlID="imgBtnClose" RepositionMode="None" ></asp:ModalPopupExtender>

     <asp:Panel ID="pnlComment" runat="server" BackColor="White" Height="400px" Width="520px" style="display:none">
         <div id="divcommentForm" class="commentForm">
            <div id="divClose" class="commentClose">
                <asp:ImageButton ID="imgBtnClose" runat="server" ImageUrl="~/images/close.png" CausesValidation="False"  />
            </div>
            <!-- comment Form -->

            <asp:Panel ID="pnlCommentForm" runat="server" Visible="true">

            </asp:Panel>
            <!-- comment Form -->
        </div>
    </asp:Panel>
</div>

<div>
<asp:ModalPopupExtender ID="mpShowCommentPopUp2" runat="server" TargetControlID="btnPostComment2" PopupControlID="pnlComment2"
 BackgroundCssClass="modalBackground" CancelControlID="imgBtnClose2" RepositionMode="None" ></asp:ModalPopupExtender>

     <asp:Panel ID="pnlComment2" runat="server" BackColor="White" Height="400px" Width="520px" style="display:none">
         <div id="divcommentForm2" class="commentForm">
            <div id="divClose2" class="commentClose">
                <asp:ImageButton ID="imgBtnClose2" runat="server"  ImageUrl="~/images/close.png" CausesValidation="False"  />
            </div>
            <!-- comment Form -->
            <asp:Panel ID="pnlCommentForm2" runat="server" Visible="true">

            </asp:Panel>
            <!-- comment Form -->
        </div>
    </asp:Panel>
</div>

<div>
    <asp:ModalPopupExtender ID="mpShowEmailArticlePopup" runat="server" TargetControlID="lnkBtnEmail" PopupControlID="pnlEmailArticle"
     BackgroundCssClass="modalBackground" CancelControlID="imgBtnCloseEmailPopup" RepositionMode="None"></asp:ModalPopupExtender>
          <asp:Panel ID="pnlEmailArticle" runat="server" BackColor="White" Height="350px" Width="520px" >
             <div id="emailArticle" class="EmailArticleForm">
                 <div id="closeEmailArticle" class="commentClose">
                    <asp:ImageButton ID="imgBtnCloseEmailPopup" runat="server" ImageUrl="~/images/close.png" onclick="imgBtnCloseEmailPopup_Click" CausesValidation="False"  /> 
                 </div>
                 <!-- Email Form -->
                 <asp:Panel ID="pnlEmailArticleForm" runat="server" Visible="true">

                 </asp:Panel>
                 <!-- Email Form -->
                 </div>
        </asp:Panel>
</div>
</asp:Content>

部分 MainPage 代码和Main Page Partial Code c#

protected void imgBtnCloseEmailPopup_Click(object sender, ImageClickEventArgs e)
{
    this.mpShowEmailArticlePopup.Show();
}

protected void lnkBtnComment_Click(object sender, EventArgs e)
{
    this.mpShowCommentPopUp.Show();
}
protected void lnkBtnEmail_Click(object sender, EventArgs e)
{
    this.mpShowEmailArticlePopup.Show();
}
protected void btnPostComment2_Click(object sender, EventArgs e)
{
    this.mpShowCommentPopUp2.Show();
}

Comment.aspx 页面代码

<%@ Page Language="C#" UICulture="Auto" AutoEventWireup="true" CodeFile="Comment.aspx.cs" Inherits="Comment" EnableViewStateMac="False" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<!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 id="Head1" runat="server" updatemode="Conditional">
    <title></title>
    <% if (Session["lang"] == "ar-AE")
       { %>
        <link href="~/Styles/arabic.css" rel="stylesheet" type="text/css" />
    <% } else { %>
        <link href="~/Styles/english.css" rel="stylesheet" type="text/css" />
    <% } %>
    <link href="Scripts/css/validationEngine.jquery.css" rel="stylesheet" type="text/css" />
    <script src="Scripts/js/jquery-1.6.min.js" type="text/javascript"></script>
    <script src="Scripts/js/jquery.validationEngine-ar.js" type="text/javascript" charset="utf-8"></script>
    <script src="Scripts/js/jquery.validationEngine-en.js" type="text/javascript" charset="utf-8"></script>
    <script src="Scripts/js/jquery.validationEngine.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
        jQuery(document).ready(function () {
            //jQuery("#Form2").validationEngine();
            <% if( Session["lang"] =="ar-AE") %>
            jQuery("#frmComment").validationEngine({ promptPosition: 'topLeft', scroll: false });
            <%else %>
            jQuery("#frmComment").validationEngine({ promptPosition: 'topRight', scroll: false });
            <% %>

           // $("#frmComment").validationEngine('attach');
            });
    </script>


</head>

<body id="body"  dir="<%=Session["PageDIR"] %>" bgcolor="White">
<form id="frmComment" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="updPnlComment" runat="server"  >
 <ContentTemplate>

<asp:Panel ID="pnlCommentForm"  runat="server" Visible="true" >
<div id="commentFormTable" class="commentFormTable">
<table align="left" cellpadding="0" cellspacing="0" width="460px"  border=0  >
        <tr>
            <td  >
                <table cellpadding="0" cellspacing="8" width="460px" >
                    <tr>
                        <td  colspan="2"><asp:Label ID="lblPostComment" runat="server" Text="Post Comment"  CssClass="lblPostComment"></asp:Label>
                        </td>
                    </tr>
                    <tr>
                        <td  colspan="2">
                        <asp:Label ID="lblCommentMsg"  CssClass="txtLabelComment" runat="server" Text="Please make sure your comment is not abusive, defamatory or offensive. All 
                            fields must be filled in correctly or the comment will not be approved." 
                                Width="400px" ></asp:Label>
                            </td>
                    </tr>
                    <tr>
                        <td colspan="2"><asp:Label ID="lblRequired" CssClass="txtLabelComment" runat="server" Text="[*] indicates a required field."></asp:Label>
                        </td>
                    </tr>
                    <tr>
                        <td width="110px">
                            <asp:Label ID="lblFullName" runat="server" Text="Full Name" CssClass="txtLabelComment"></asp:Label>
                        </td>
                        <td width="340px">
                            <asp:TextBox ID="txtFullName" runat="server" 
                                CssClass="validate[required] txtbox300Comment" TabIndex="1" ></asp:TextBox>
                            &nbsp;*
                            <asp:RequiredFieldValidator ID="rfv1" runat="server" 
                                ControlToValidate="txtFullName"></asp:RequiredFieldValidator>
                            </td>

                    </tr>
                    <tr>
                        <td >
                            <asp:Label ID="lblEmail" runat="server" Text="Email Address" CssClass="txtLabelComment"></asp:Label>
                        </td>
                        <td>
                            <asp:TextBox ID="txtEmail" runat="server" 
                                CssClass="validate[required,custom[email]] txtbox300Comment" TabIndex="2" ></asp:TextBox>
                            &nbsp;*
                            <asp:RequiredFieldValidator ID="rfv2" runat="server" 
                                ControlToValidate="txtEmail"></asp:RequiredFieldValidator>
                        </td>
                    </tr>
                    <tr>
                        <td >
                            <asp:Label ID="lblCountry" runat="server" Text="Country" CssClass="txtLabelComment"></asp:Label>
                        </td>
                        <td>
 <asp:DropDownList ID="ddCountry" runat="server" CssClass="validate[required] ddGeneralComment" 
                                TabIndex="3">
    <asp:ListItem Value="" ></asp:ListItem>
    <asp:ListItem Value="AF">Afghanistan</asp:ListItem>
    <asp:ListItem Value="AL">Albania</asp:ListItem>
    <asp:ListItem Value="DZ">Algeria</asp:ListItem>
    <asp:ListItem Value="AS">American Samoa</asp:ListItem>
    <asp:ListItem Value="AD">Andorra</asp:ListItem>
    <asp:ListItem Value="AO">Angola</asp:ListItem>
    <asp:ListItem Value="AI">Anguilla</asp:ListItem>
    <asp:ListItem Value="ZR">Zaire</asp:ListItem>
    <asp:ListItem Value="ZM">Zambia</asp:ListItem>
    <asp:ListItem Value="ZW">Zimbabwe</asp:ListItem>
 </asp:DropDownList>
                            &nbsp;*<asp:RequiredFieldValidator ID="rfv3" runat="server" 
                                ControlToValidate="ddCountry"></asp:RequiredFieldValidator>
                        </td>
                    </tr>
                    <tr>
                        <td >
                            <asp:Label ID="lblMSG" runat="server" Text="Your Message" CssClass="txtLabelComment" ></asp:Label>
                        </td>
                        <td>
                            <asp:TextBox ID="txtMessage" runat="server" CssClass="validate[required, maxSize[1000]] txtbox300MComment" 
                                TextMode="MultiLine" MaxLength="10" TabIndex="4"></asp:TextBox>
                            &nbsp;*<asp:RequiredFieldValidator ID="rfv4" runat="server" 
                                ControlToValidate="txtMessage"></asp:RequiredFieldValidator>
                        </td>
                    </tr>
                    <tr>
                        <td >&nbsp;</td>
                        <td>
                            <asp:CheckBox ID="cbAnonymous" runat="server" 
                                Text="I wish to be anonymous. Do not publish my name with my comment. " CssClass="txtLabelComment" />
                        </td>
                    </tr>
                    <tr>
                        <td > &nbsp;</td>
                        <td> 
                        <div>
                            <asp:Button ID="btnSaveComments" runat="server" CssClass="buttonPopups" onclick="btnSaveComments_Click" Text="Post Comment"  />
                        </div>
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
</asp:Panel>
 <asp:Panel ID="pnlCommentSuccessMSG" runat="server" Visible="false">
 <table align="center" cellpadding="0" cellspacing="0" width="510px">
        <tr>
            <td height="410px" valign="middle" align="center">
                <asp:Label ID="lblCommentSuccessMSG" runat="server" Text=""></asp:Label>
            </td>
            </tr>
</table>
</div>
</asp:Panel>

 </ContentTemplate>
    </asp:UpdatePanel>
</form>
</body>
</html>

这是我对此感到沮丧并一直在使用它的代码从最后开始一周我修复了一件事，另一件事

但是当我使用 Ajax Modal Popup 和更新面板调用此页面时，错误开始蔓延。

我必须提到代码在单个页面上运行良好， 具有相同的功能，

我将不胜感激，并且将不胜感激。

Answer 1

这可能有助于让处于类似情况的人通过。如果您在与更新面板相同的页面上使用脚本管理器注册脚本，这将起作用。

Dim strScript As New StringBuilder()
strScript.AppendLine("<script type=""text/javascript"">")
' execute first
strScript.AppendLine(strJavascript)
' register for partialpostbacks
strScript.AppendLine("if(typeof(Sys)!=='undefined'){")
strScript.AppendLine("if(typeof(Sys.WebForms)!=='undefined'){")
strScript.AppendLine("if(typeof(Sys.WebForms.PageRequestManager)!=='undefined'){")
strScript.AppendLine("var prm = Sys.WebForms.PageRequestManager.getInstance();")
strScript.AppendLine("prm.add_endRequest(function(){")
strScript.AppendLine(strJavascript)
strScript.Append("});")
strScript.AppendLine("}")
strScript.AppendLine("}")
strScript.AppendLine("}")
strScript.AppendLine("</script>")

然而，我目前在使用我设置的 JQuery 包装器类的实现中遇到了一些困难。效果很好，但在更新面板内使用时该类会失败。仍在解决这个问题......想法总是受到赞赏！