ASP.Net Обновление панели кошмар.Кнопка не срабатывает должным образом.Веб-форма c #

Question

У меня есть две ссылки для загрузки Comment.aspx в качестве модального всплывающего окна с использованием Ajax ModalPopup.

Одна ссылка - это LinkBuuton, открывающая тот же Comment.aspx в ModalPopup1, а другая ссылка - это кнопка «Отправить», в которой публикуется комментарий, который также загружает ту же страницу в другом Modalpopup2. Я использую jQuery для захвата даже клика и загрузки страницы Comment.aspx в уважаемый ModalPopup.

Проблема в том, что когда я открываю всплывающее окно "mpShowCommentPopUp" с помощью кнопки ссылки "lnkBtnComment", оно работает нормально и показывает встроенную проверку без каких-либо проблем.

Но теперь, если я закрою это всплывающее окно и попытаюсь загрузить тот же Comment.aspx, используя кнопку "btnPostComment2" в этом сценарии, кнопка не срабатывает.

И если я обновлю страницу и теперь сначала открою страницу Comment.aspx с помощью lnkBtnComment, на этот раз она будет работать, и проверка будет отображаться без каких-либо проблем, и если я повторю первый шаг, кнопка снова не будет срабатывать.

Я размещаю частичный код MainPage и код 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>

Частичный код главной страницы 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-оболочки.Работает отлично, но класс не работает при использовании внутри панели обновления.Все еще работаем над этим ... идеи всегда ценятся!