【问题标题】:How to trigger a modal window in ASP.NET WebForms?如何在 ASP.NET WebForms 中触发模式窗口?
【发布时间】:2014-11-28 05:55:13
【问题描述】:

如何在 ASP.NET WebForms 应用程序中显示模式窗口?我需要显示一个带有 2 个按钮(确定/取消)的模式窗口并检索在我的代码中按下了哪个按钮。我也在为这个项目使用 jQuery 和 Bootstrap,如果这会影响我的选择的话。

【问题讨论】:

  • 如果您是 asp.net 的新手,ModalPopupExtender 很容易实现。其他需要一点jQuery知识。

标签: c# jquery asp.net webforms


【解决方案1】:

您好,请使用modalpopupextender 检查此代码。但首先,您需要从 Nuget 包管理器安装 AjaxControlToolKit,并将其作为程序集引用添加到 .aspx 页面的顶部作为指令,如下所示:

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>

那么这里是来自modalpopupextender的代码:

     <asp:Button ID="btnOpenPopUp" runat="server" text="Open PopUp" />
     <asp:Label ID="lblHidden" runat="server" Text=""></asp:Label>
        <ajaxToolkit:ModalPopupExtender ID="mpePopUp" runat="server" TargetControlID="lblHidden" PopupControlID="divPopUp" BackgroundCssClass="modalBackground"></ajaxToolkit:ModalPopupExtender>

<div id="divPopUp" class="pnlBackGround">
     <div id="Header" class="header" >MyHeader</div>
     <div id="main" class="main">Main PopUp </div>
     <div id="buttons">
          <div id="DivbtnOK" class="buttonOK"><asp:Button id="btnOk" runat="server" text="Ok" /></div>
          <div id="Divbtncancel" class="buttonOK"><asp:Button id="btnCancel" runat="server" text="Cancel" /></div>
     </div>
</div>

然后从按钮 Open PopUp 的 On Click 事件背后的代码:

protected void btnOpenPopUp_Click(object sender, ImageClickEventArgs e)
{
    mpePopUp.Show();
}

然后点击确定按钮:

protected void btnOk_Click(object sender, ImageClickEventArgs e) {
    //Do Work

    mpePopUp.Hide(); }

取消点击按钮:

protected void btnCancel_Click(object sender, ImageClickEventArgs e)
{
    //Do Work

    mpePopUp.Hide();
}

提示:如果您没有 ajax 工具包,可以使用 Nuget 安装它。

【讨论】:

  • 不知何故,我无法完成这项工作。我将代码放在带有 runat 服务器的表单标签中,并添加了一个 ScriptManager,但是无济于事。当我按下 btnOpenPopUp 按钮时,屏幕上没有任何变化。
  • 在我的测试中,当我添加 | OnClick="btnOpenPopUp_Click" |到按钮'btnOpenPopUp'...
猜你喜欢
  • 1970-01-01
  • 2020-12-25
  • 2023-01-12
  • 1970-01-01
  • 2020-04-09
  • 1970-01-01
  • 2016-12-09
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多