将数据传递到 ModalPopupExtender

Question

我有一个 ModalPopupExtender，它允许客户应用付款信息。它一直工作得很好。然后客户要求在 ModalPopup 上查看应付总额。仅从父控件中获取应得的总额并将其传递给 ModalPopup 控件似乎没什么大不了的。似乎没有简单的方法可以做到这一点。

这是我的 HTML 代码，请记住此代码包含在 UpdatePanel 中

<asp:LinkButton ID="lnkMakePayment" runat="server" Visible="true" OnClick="lnkMakePayment_Click" >

<asp:Label ID="lblMakePayment" runat="server" Text="Make Payment"/></asp:LinkButton>

<asp:Button ID="btnDummy" style="display: none;" runat="server" 
            OnClick="btnDummy_Click" />

<ajaxToolkit:ModalPopupExtender ID="mdlPopupPayment" runat="server" 
 TargetControlID="btnDummy" PopupControlID="pnlMakePayment"
 CancelControlID="popUpCancel" DropShadow="true" BackgroundCssClass="modalBackground">
</ajaxToolkit:ModalPopupExtender>

 <asp:Panel ID="pnlMakePayment" runat="server" Style="display: none;"
            SkinID="PopUpPanel" class="ContentBoxColor" Width="400px" Height="170px">
    <MP1:MakePaymentPopup ID="MakePayment"  runat="server" />
    <div style="text-align: right; width: 100%; margin-top: 5px;">
       <asp:Button ID="popUpCancel" runat="server" Text="Cancel" Width="0px" />
    </div>
 </asp:Panel>

下面是代码隐藏

protected void btnDummy_Click(object sender, EventArgs e) { }

protected void lnkMakePayment_Click(object sender, EventArgs e)
{
    mdlPopupPayment.Show();
} 

因此，当用户单击付款链接时，ModalPopup 可以正常工作。它甚至会触发父控件侦听的事件，以应用付款信息以及用户在弹出窗口中填写的所有相关付款详细信息。同样，这一切都很好。

由于 ModalPopup，我第一次尝试发送总数如下：

protected void lnkMakePayment_Click(object sender, EventArgs e)
{
    // MakePayment is the actual ModalPopup control and total due is a public property
    MakePayment.TotalDue = txtTotalDue.Text
    mdlPopupPayment.Show();
} 

问题在于，当我单击链接以显示 ModalPopup 时，PageLoad 事件不会触发，因此我无法将我的属性分配给 ModalPopup 内的标签。 我什至尝试使用会话对象，但遇到了同样的问题。 我什至无法访问数据库，因为我无法传递客户 ID。 有任何想法吗？ 我是 Javascript 的新手，喜欢服务器端的灵魂，但在这一点上，我愿意尝试任何东西。

MakePayment 用户控件包含 3 个 asp 文本框。一个供用户输入付款金额，另一个用于付款类型，第三个用于输入支票号码等注释。控件上还有一个应用和取消按钮。父控件是一个基本的 ascx 页面，它是一个包含 ModalPopupExtender 和激活它的所有 html 代码的数据输入屏幕。

Answer 1

无需创建用户控件即可将数据传递到模式弹出窗口。如果我需要在不同的位置重用它，我只会创建一个用户控件。如果您不需要在多个位置重复使用它，那么您不需要用户控件。而是这样做：

假设您需要一个显示字符串并具有确定和取消按钮的弹出窗口，但您需要在弹出之前设置字符串值。

1. 创建面板。
2. 在步骤 1 中的面板中放置一个 UpdatePanel。
3. 在 UpdatePanel 中放置一个 Button 和 ModalPopupExtender。

4. 在弹出扩展器下方的 UpdatePanel 中放置一个标签、确定和取消按钮。如下所示：

   <asp:Panel ID="Panel1" runat="server" CssClass="popup" Width="320px" Style="display:none">
      <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
          <ContentTemplate>
              <asp:Button ID="Button1" runat="server" Style="display:none" />
              <cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server"
                  TargetControlID="Button1"
                  PopupControlID="Panel1"
                  CancelControlID="CancelButton">
              </cc1:ModalPopupExtender>
              <asp:Label ID="Label1" runat="server" />
              <asp:Button ID="OkButton" runat="server" Text="Ok" CausesValidation="true" OnClick="OkButton_OnClick" />&nbsp;
              <asp:Button ID="CancelButton" runat="server" Text="Cancel" CausesValidation="false" />
          </ContentTemplate>
      </asp:UpdatePanel>
   </asp:Panel>
   

5. 接下来，在您的页面上，像这样放置一个 Button 和一个 TextBox：

   <asp:TextBox ID="MyTextBox" runat="server" />
   <asp:Button ID="MyButton" runat="server" Text="Popup" OnClick="MyButton_OnClick" />
   

6. 现在，在页面后面的代码中，放置 MyButton 的处理程序：

   protected void MyButton_OnClick(object sender, EventArgs e)
   {
        Label1.Text = MyTextBox.Text;
        UpdatePanel1.Update();
        ModalPopupExtender1.Show();
   }
   

Answer 2

我认为您需要提供更多信息。您能否向我们展示或描述您的 MakePayment 用户控件中包含的标记/代码隐藏？当您谈论“父控件”时，您指的是哪个元素？ MakePayment、pnlMakePayment、pnlDummy？

Answer 3

一旦我意识到自己做错了什么，我想出的解决方案就很简单了。 我必须感谢 Arnold Matusz，因为他的博客文章让我看到了光明。 http://blog.dreamlabsolutions.com/post/2009/01/10/ModalPopupExtender-to-show-a-MessageBox.aspx

而不是让 ModalPopup entender 调用只显示一些 html 的用户控件。我制作了一个用户控件，它是 ModalPopupExtender。这样我就可以调用它并传入一些数据。

我的 MakePayment 用户控件的 HTML 看起来像

<asp:Button ID="btnDummy" style="display: none;" runat="server"  
   OnClick="btnDummy_Click" />
<ajaxToolkit:ModalPopupExtender ID="mdlPopupPayment" runat="server"  
            TargetControlID="btnDummy" PopupControlID="pnlMakePayment" 
            CancelControlID="popUpCancel" DropShadow="true"
            BackgroundCssClass="modalBackground">
</ajaxToolkit:ModalPopupExtender>
<asp:Panel ID="pnlMakePayment" runat="server" Style="display: none;"  
    SkinID="PopUpPanel" class="ContentBoxColor" Width="400px" Height="170px">
<div class="contentbox">
    <div class="contentboxHeader1">
        <asp:Label ID="lblPopupTitle" Width="350px" runat="server" Text=""></asp:Label>
    </div>
    <div class="contentbox">
        <div style="text-align: left">
            <asp:Label ID="lblTotalDue" Width="100px" runat="server" Text="">  
            </asp:Label>
            <asp:Label ID="lblTotalDueValue" Width="100px" runat="server">
            </asp:Label>
         </div>
        <div style="text-align: left">
            <asp:Label ID="lblPayment" Width="100px" runat="server" Text=""></asp:Label>
            <asp:TextBox ID="txtPayment" Width="100px" runat="server"></asp:TextBox>
            <ajaxToolkit:FilteredTextBoxExtender ID="ftbePayment" runat="server" 
               TargetControlID="txtPayment" FilterType="Custom, Numbers" 
                 ValidChars="."> </ajaxToolkit:FilteredTextBoxExtender>
        </div>
        <div style="text-align: left">
            <asp:Label ID="lblPaymentRefNo" Width="100px" runat="server" Text=""> 
            </asp:Label>
            <asp:TextBox ID="txtPaymentRefNo" Width="100px" runat="server">
            </asp:TextBox>
        </div>
        <div style="text-align: left">
        <asp:Label ID="lblPaymentType" Width="100px" runat="server" Text=""></asp:Label>
            <asp:TextBox ID="txtPaymentType" Width="250px" runat="server"></asp:TextBox>
        </div>
    </div>
    <div class="contentbox" style="text-align=right">
        <asp:Button ID="btnApplyPayment" runat="server" Text="" 
             OnClick="btnApplyPayment_Click" />
        <asp:Button ID="btnCancel" runat="server" Text="" OnClick="btnCancel_Click" />
    </div>
</div>
<div style="text-align: right; width: 100%; margin-top: 5px;">
    <asp:Button ID="popUpCancel" runat="server" Text="Cancel" Width="0px" />
</div>
</asp:Panel>

而且在后面的代码中我有一个公共方法

public void MakePayment(string szAmountDue)
{
    lblTotalDueValue.Text = szAmountDue;
    mdlPopupPayment.Show();
}

在我的主表单上，我有一个名为“付款”的链接

<asp:LinkButton ID="lnkMakePayment" runat="server" Visible="true" 
      OnClick="lnkMakePayment_Click" >
     <asp:Label ID="lblMakePayment" runat="server" Text=""/>
</asp:LinkButton>

当点击 Make Payment 链接时，后面的代码调用 MakePayment 控件，传入我希望显示的任何数据。

protected void lnkMakePayment_Click(object sender, EventArgs e)
{
    MakePayment.MakePayment(lblTotalValue.Text.ToString());
} 

Answer 4

<asp:Panel runat="server" ID="pPopupQuoteSearch" CssClass="modalPopupQuote" Style="display: none">
    <asp:LinkButton ID="lbClose" Text="Close" runat="server" />
    <div id="dQuoteContainer" runat="server">
    </div>
</asp:Panel>
<asp:Button ID="Button5" runat="server" Style="display: none" />
<cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="Button5"
        PopupControlID="pPopupQuoteSearch" BackgroundCssClass="modalBackground" OkControlID="lbClose">
</cc1:ModalPopupExtender>

C#代码

protected void btnQuteSearch_Click(object sender, EventArgs e)
{
    pPopupQuoteSearch.Style.Remove("display");
    pPopupQuoteSearch.Style.Add("display", "inline");

    dQuoteContainer.InnerHtml = "some HTML code";

    ModalPopupExtender1.Show();
}