无法使用ASP.NET中的UpdatePanel设置ModalPopupExtender控件值

时间:2013-11-21 21:18:04

标签: asp.net updatepanel modalpopup

使用asp.net,我在更新面板中有一个gridview,填充了动态用户控件(在rowdatabound上的placeholder1中加载)。用户在用户控件的文本框中输入文本,单击用户控件的“确认”按钮,模式弹出窗口显示带有用户文本框值的“确认”消息。用户控件的按钮单击事件处理设置模式弹出扩展器控件值并显示弹出窗口。

当gridview不在更新面板中/没有使用更新面板时,这可以正常工作。一旦我将gridview放在更新面板中,当模态弹出窗口出现时,它不会显示按钮单击事件中设置的值(我已确认点击事件正在触发,控件正在找到,值是在事件中设置)。我必须遗漏一些东西......和/或不太了解更新面板的体系结构以及它与动态控件的行为方式。

[以下代码已简化]

GRIDVIEW

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:GridView ID="gvSaleData" runat="server" DataKeyNames="ItemNumber"
 AutoGenerateColumns="False" ShowFooter="True" />
<Columns>
  <asp:TemplateField ShowHeader="false">
     <ItemTemplate>
         <div>
        <asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>     
       </div>
     </ItemTemplate>
  </asp:TemplateField>    
  </Columns>
  </asp:GridView>
 </ContentTemplate> 
 </asp:UpdatePanel>  

MODAL POPUP

<asp:modalpopupextender id="mp1" runat="server" 
        cancelcontrolid="btnCancel"
        targetcontrolid="btnShow" popupcontrolid="pnlShow"
        popupdraghandlecontrolid="PopupHeader" drag="true" 
        backgroundcssclass="ModalPopupBG">
</asp:modalpopupextender>
<asp:panel id="pnlShow"  style="display:none" runat="server">
<div class="popupcontainer">
        <div>Your Value: <asp:Label ID="lblUserValue" runat="server" Text=""></asp:Label></div>
<asp:Button ID="btnConfirm" runat="server" Text="Confirm" 
            onclick="btnConfirm_Click" CssClass="submit"/>
 <asp:Button ID="btnCancel" runat="server" Text="Return" 
            onclick="btnCancel_Click" CssClass="submit"/>
</div>   
</asp:panel>

用户控制代码

protected void btnShowConfirmation_Click(object sender, EventArgs e)
{
AjaxControlToolkit.ModalPopupExtender mp =(AjaxControlToolkit.ModalPopupExtender)Page.FindControl("mp1");
Label lblUserValue = (Label)mp.FindControl("lblUserValue");
lblUserValue.Text = textbox1.Text;
mp.Show();
}

1 个答案:

答案 0 :(得分:1)

我最近才发现这个问题,一年后它被问及我发布的解决方案,以防任何其他人遇到同样的问题。

答案是将ModalPopupExtender面板&#34; pnlShow&#34;在更新面板中添加了一个ID为btnShowConfirmation的AsycPostBackTrigger。

如果动态添加btnShowConfirmation,则应将其动态添加到UpdatePanel。

附带的示例显示了两个用于引发模态弹出窗口的按钮。在aspx代码中添加了对btnX的触发器引用,动态添加了btnY triger作为示例。

[Aspx代码]

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="TestModalPopup.aspx.vb"
  Inherits="USSGAinfo.TestModalPopup" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>
<!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 runat="server">
  <title></title>
   <style type="text/css">
    .modalPopupX
    {
      background-color: #DDFFDD;
      border-width: 2px;
      border-style: solid;
      border-color: black;
      padding-top: 20px;
      padding-left: 10px;
      width: 400px;
      height: 150px;
    }
  </style>
</head>
<body>
  <form id="form1" runat="server">
  <ajaxToolkit:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
  </ajaxToolkit:ToolkitScriptManager>
  <!-- Hidden Field -->
  <asp:UpdatePanel runat="server" ID="up1" ChildrenAsTriggers="false" UpdateMode="Conditional">
    <Triggers>
      <asp:AsyncPostBackTrigger ControlID="OkButton" />
    </Triggers>
    <ContentTemplate>
      <asp:Button runat="server" ID="btnX" Text="X" />
      <asp:Button runat="server" ID="btnY" Text="Y" /><br />
      <asp:Label runat="server">Confirm:</asp:Label><asp:Label runat="server" ID="lblResult"></asp:Label>
     </ContentTemplate>
  </asp:UpdatePanel>

  <asp:HiddenField ID="hidForModal" runat="server" />
  <ajaxToolkit:ModalPopupExtender ID="MPE" runat="server" TargetControlID="hidForModal"
    PopupControlID="pnlTarget" BackgroundCssClass="modalBackground" PopupDragHandleControlID="pnlTarget">
    </ajaxToolkit:ModalPopupExtender>

  <asp:Panel ID="pnlTarget" Style="display: none" runat="server">
  <asp:UpdatePanel runat="server" ID="up2" ChildrenAsTriggers="false" UpdateMode="Conditional">
    <Triggers>
      <asp:AsyncPostBackTrigger ControlID="btnX" />
     <%-- <asp:AsyncPostBackTrigger ControlID="btnY" />--%>
    </Triggers>
    <ContentTemplate>  <asp:Panel runat="server" ID="Panel1" HorizontalAlign="Center" DefaultButton="OkButton"
      CssClass="modalPopupX">
      <asp:Table runat="server">
        <asp:TableRow runat="server">
          <asp:TableCell runat="server" ID="tcResult" HorizontalAlign="Center" Width="400px" Height="20px" BackColor="AntiqueWhite">Button Clicked:
          <asp:label runat="server" ID="lblMPEResult"></asp:label>
          </asp:TableCell>
        </asp:TableRow>
      </asp:Table>
      <br />
      <asp:Button ID="OkButton" runat="server" Text="Yes" />&nbsp;
      <asp:Button ID="CancelButton" runat="server" Text="No" />
    </asp:Panel>
   </ContentTemplate>
  </asp:UpdatePanel>
  </asp:Panel> 
  </form>
</body>
</html>

[代码背后]

Public Class TestModalPopup
    Inherits System.Web.UI.Page

  Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
    ' Add btnY as trigger for ModalPopoup update panel
    Dim trigger As New AsyncPostBackTrigger
    trigger.ControlID = "btnY"
    trigger.EventName = "Click"
    up2.Triggers.Add(trigger)
  End Sub

  Private Sub btnX_Click(sender As Object, e As System.EventArgs) Handles btnX.Click
    ' Put button dependent info into ModalPopup and then show
    lblMPEResult.Text = "XXX"
    MPE.Show()
  End Sub

  Private Sub btnY_Click(sender As Object, e As System.EventArgs) Handles btnY.Click
    ' Put button dependent info into ModalPopup and then show
    lblMPEResult.Text = "YYY"
    MPE.Show()
  End Sub

  Private Sub OkButton_Click(sender As Object, e As System.EventArgs) Handles OkButton.Click
    ' Show that OK button was pressed and also information derived from the ModalPopup
    lblResult.Text = lblMPEResult.Text
    MPE.Hide()
  End Sub

  Private Sub CancelButton_Click(sender As Object, e As System.EventArgs) Handles CancelButton.Click
    MPE.Hide()
  End Sub
End Class