AJAX Toolkit模态弹出窗口不会出现

Question

我在从服务器端调用模式弹出窗口时遇到了一些麻烦。 所以，我将modalpopupextender的targetcontrolID设置为隐藏标签。 然后在按钮点击的代码隐藏中，我尝试添加this.modalpopup.show（）; 不幸的是，当发生这种情况时，模态弹出窗口不会出现。 我可以看到代码被执行，但没有显示。

这是我的ASP。 减去<按钮和popupextender的开口<，因为某些原因，这些线条不会显示。

<asp:Button CssClass="Button" ID="button" runat="server" Text="Button" AccessKey="m" meta:resourcekey="buttonResource1" OnClick="button_Click" /> 

<ajaxToolkit:ModalPopupExtender ID="mpe" runat="server" TargetControlID="forpopup"
            PopupControlID="PopupPanel" BackgroundCssClass="modalBackground" />

       <asp:Label ID="forpopup" runat="server" Visible="False"></asp:Label>

        <asp:panel id="PopupPanel" runat="server" BorderStyle="Groove" BorderColor="black" BorderWidth="3px" BackColor="AliceBlue" Height="200px" Width="200px" style="display: none">

            <asp:Label ID="lblPopup" runat="server" Text="popup!"></asp:Label><br />
            <br />
            <asp:DropDownList ID="ddlData" runat="server">
            </asp:DropDownList><br />
            <br />

            <asp:Button ID="btnPopupOK" runat="server" Text="Ok" />
            <asp:Button ID="btnPopupCancel" runat="server" Text="Cancel" />
        </asp:panel>    

这是我的代码隐藏

    protected void button_Click(object sender, EventArgs e)
    {
        this.mpe.Show();
    }

Answer 1

我遇到了类似的问题..我正在将扩展器的targetcontrolid设置为隐藏按钮并尝试在服务器端代码中触发Show（）事件。 即使代码被击中，它也没有显示出来。 我发现问题是我使用“visible = false”隐藏了隐藏按钮，该按钮不会将控件呈现给页面。 我将其更改为“style ='display：none'”并开始工作。 尝试将目标控件更改为隐藏按钮，并确保它已渲染（只是未显示），也许它会起作用。

Answer 2

根据ASP.NET AJAX ModalPopup文档

TargetControlID是激活模态弹出窗口的元素的ID。

在示例代码中， TargetControlID设置为Label ID="forpopup" ，但在代码隐藏中，您尝试使用Button ID="button"的单击事件处理程序显示ModalPopup。

您是否尝试将TargetControlID更改为"button"并查看ModalPopup是否出现？

几个笔记

• 使用Label ID="forpopup"作为TargetControlID的目的是什么？
• Label ID="forpopup"将不会在客户端上以HTML格式呈现。

编辑：

演示代码显示使用 -

aspx内容页面

<asp:Content ID="Content1" ContentPlaceHolderID="Main" runat="server">    
  <asp:Button ID="btnShow" runat="server" Text="Open ModalPopup" />     

  <ajaxToolkit:ModalPopupExtender runat="server" ID="modal" BackgroundCssClass="darken" 
  CancelControlID="btnCancel" PopupControlID="pnl" TargetControlID="btnShow" />

  <asp:Panel ID="pnl" runat="server" style="width:55%;display:none;">
        <h1>You can now see me!</h1>
        <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, 
        sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
        Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris 
        nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in 
        reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla 
        pariatur. Excepteur sint occaecat cupidatat non proident, sunt in 
        culpa qui officia deserunt mollit anim id est laborum."</p>
        <asp:Button ID="btnCancel" runat="server" Text="Close" />
  </asp:Panel>
</asp:Content>

代码隐藏

    protected void Page_Load(object sender, EventArgs e)
    {

    }

    protected override void OnInit(EventArgs e)
    {
        base.OnInit(e);
        btnShow.Click += new EventHandler(btnShow_Click);
    }

    protected void btnShow_Click(object sender, EventArgs e)
    {
        modal.Show();
    }

Answer 3

我通常在他们要修改的按钮/面板/控件之后添加任何类型的扩展器。 我没有在指南中直接看到有关控件的信息，说明他们必须采用这种方式，但是当我将扩展器放在控件之前时，我遇到了太多问题。

尝试将扩展器放在面板和按钮之后，看看是否能解决问题。

Answer 4

我同意Dillie-O，如果你从Serverside调用它，我认为你需要一个更新面板：

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
  <asp:panel id="PopupPanel" runat="server" BorderStyle="Groove" BorderColor="black" BorderWidth="3px" BackColor="AliceBlue" Height="200px" Width="200px" style="display: none">
    ...
  </asp:panel>
</ContentTemplate>
</asp:UpdatePanel>

然后

protected void button_Click(object sender, EventArgs e)
{
    this.mpe.Show();
    UpdatePanel1.Update();
}

Answer 5

请将ModalPopupExtender的BehaviourID属性设置为某个值，然后您就可以显示和隐藏模态弹出窗口。

Answer 6

当TargetControlID按钮出现时，我没有显示Modal Popup的问题

UseSubmitBehavior="false"

将其设置为“true”，看看是否能解决您的问题。 如果这样做，并假设您不希望按钮提交，那么您可能需要在不希望的情况下停止提交表单。