【问题标题】:asp ModalPopupExtender is getting closed when page is getting postback当页面正在回发时,asp ModalPopupExtender 正在关闭
【发布时间】:2014-02-24 04:17:36
【问题描述】:

我正在使用 asp ModalPopupExtender 在 asp.net 页面中显示树视图。当我单击一个按钮时,将引发一个 ModalPopupExtender 并使用复选框加载树视图(加载树视图是一个用户控件 ascx)。在该用户控件中,我编写了一些服务器端代码,以便在检查父节点时检查所有子节点。对此我的页面将得到回发。我的问题是当我的页面被回发时,我的 ModalPopupExtender 正在启动,并且我的功能运行正常。

这是我在 ascx 页面中的树形视图

 <asp:TreeView ID="tvFolderSelect" runat="server" RootNodeStyle-ForeColor="Black"
    CssClass="foldertree" LeafNodeStyle-ForeColor="Black" LeafNodeStyle-Font-Bold="false"
    ParentNodeStyle-ForeColor="Black" Width="100%" Style="margin: 3px 0 0 -16px;"
    OnTreeNodePopulate="tvFolderSelect_TreeNodePopulate" OnTreeNodeCheckChanged="tvFolderSelect_TreeNodeCheckChanged" onclick="postbackOnCheck(event);"
    ShowCheckBoxes="All" >
  <LeafNodeStyle Font-Bold="False" ForeColor="Black" CssClass="foldertreeleafnode"
        ImageUrl="~/images/img_dms/sm_fldr.png"  />
    <ParentNodeStyle Font-Italic="True" ImageUrl="~/images/img_dms/sm_fldr.png" Font-Underline="True"
        CssClass="foldertreeparentnode"/>
    <NodeStyle Font-Names="Tahoma" Font-Size="8pt" ForeColor="Black" HorizontalPadding="0px"
        NodeSpacing="0px" VerticalPadding="0px" />
    <RootNodeStyle ForeColor="Black" CssClass="foldertreerootnode" />
    <SelectedNodeStyle Font-Underline="False" HorizontalPadding="0px" VerticalPadding="0px" />
</asp:TreeView>

这是获取回发的javascript函数

 function postbackOnCheck(e) {
    var evt = e || window.event;
    var o = evt.target || evt.srcElement;
    if (o.tagName == 'INPUT' && o.type == 'checkbox' && o.name != null && o.name.indexOf('CheckBox') > -1) {
       __doPostBack("", "");
    }
}

这是我正在使用的控件

  <img id="AddActivity" runat="server" src="../images/plus1.gif" alt="" style="text-align: right;
                                cursor: pointer; float: right; padding: 1%;" />
                            <asp:ModalPopupExtender ID="MPEACT" runat="server" TargetControlID="AddActivity"
                                PopupControlID="ACTDiv" BackgroundCssClass="modalBackground" />

我怎样才能停止让 ajax 弹出窗口不可见。

【问题讨论】:

  • 您能否在页面完全加载后发布在浏览器中呈现的标记...在某个时间点后有脚本注入到您的网页中。我对在执行该脚本之前需要时间加载的任何内容感兴趣......
  • 您是否尝试过使用更新面板进行回发?这样你就会得到预期的结果。
  • 这是页面底部的链接asp.net/ajax/documentation/live/overview/…,您也可以找到一些示例。
  • 在 pastebin.com 或类似的服务中分享渲染的 html。
  • 这是我的 HTML pastebin.com/MYPuG0hH

标签: c# javascript asp.net ajax postback


【解决方案1】:

这是我为重新创建您的问题所做的。我创建了一个带有模式弹出扩展器的网页。

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ModalPopExample.aspx.cs" Inherits="WebApp.ModalPopup.ModalPopExample" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Test Page</title>
    <style type="text/css">
        .hide
        {
            display:block;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>

    </div>
        <ajaxToolkit:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
        </ajaxToolkit:ToolkitScriptManager>
        <asp:Panel ID="Panel1" CssClass="hide" runat="server" BorderColor="Red" BorderStyle="Dashed" BorderWidth="3px">
            Are you sure?
            <br />
            <asp:Button ID="btnok" runat="server" Text="OK" />
            <asp:Button ID="btncancel" runat="server" Text="Cancel" />
        </asp:Panel>
        <asp:Button ID="btnShow" runat="server" Text="Show Modal" />
        <asp:Image ID="Image1" ImageUrl="~/image_loader.ashx" runat="server" />
        <ajaxToolkit:ModalPopupExtender ID="btnShow_ModalPopupExtender" DropShadow="true" OkControlID="btnok" CancelControlID="btncancel" PopupControlID="Panel1" runat="server" DynamicServicePath="" Enabled="True" TargetControlID="btnShow">
        </ajaxToolkit:ModalPopupExtender>        
    </form>
    <script>
        var prm = Sys.WebForms.PageRequestManager.getInstance();
        prm.add_pageLoaded(function () {
            console.log('loaded');
        });
    </script>
</body>
</html>

请注意,图像是通过处理程序文件 (ashx) 加载的:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading;
using System.Web;

namespace WebApp.ModalPopup
{
    /// <summary>
    /// Summary description for image_loader
    /// </summary>
    public class image_loader : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "image/jpg";
            var imagePath = context.Server.MapPath("~/images/windows_xp_bliss-wide.jpg");
            Thread.Sleep(20000);
            context.Response.TransmitFile(imagePath);
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}

弹出窗口闪烁了一会儿。您可以做的最简单的解决方法是首先隐藏元素本身(通过 css),并且当网页完全加载时需要一些 javascript 来删除该 css。

    <style type="text/css">
        .hide
        {
            display:none;
        }
    </style>

当你 ajax 客户端脚本全部完成加载...找到控件并删除元素上的上述类。

<script>
    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_pageLoaded(function () {
        console.log('loaded');
        var div = document.getElementById('Panel1');
        div.className = '';
    });
</script>

希望这会有所帮助。

【讨论】:

  • 我的疑问是,我正在写 __doPostBack("", "");用于在另一个页面(ascx 用户控件)中获取树视图的回发 onclick。但是我们通过 modelpopupextender 在另一个(主)页面中显示 ascx 页面。现在 __doPostBack("", "");我猜方法是申请主页而不是那个ascx页面。你说什么??
  • 在 Google+ 中添加了你 :) 我是 Naresh Jadapalli。
  • Ascx 应该被认为是类似“可重用”组件的东西。它本身不是一个页面。无论如何,我不太了解您的问题是如何影响页面回发的。它从来不是原始问题的一部分。看来您需要在这里提出另一个问题。
  • 一句忠告:不要因为卡住就发布问题。尝试提出一个“模拟”您的实际问题的“假”问题。它可以帮助我们重新创建您面临的问题,还可以帮助这里的人们提供更好的答案。当你这样做的时候,你自己可能会想出一个解决方案。 :)
  • 我在 Javascript 中试过这个 .. 请看一下stackoverflow.com/questions/21985699/…
【解决方案2】:

尝试使用更新面板并参考下面的链接详细了解为什么 Modalpopup 在回发时关闭?

http://patelshailesh.com/index.php/why-does-modalpopup-close-on-postback

【讨论】:

  • 我试过这个。它的行为仍然像以前一样。我的疑问是,我正在写 __doPostBack("", "");用于在另一个页面(ascx 用户控件)中获取树视图的回发 onclick。但是我们通过 modelpopupextender 在另一个(主)页面中显示 ascx 页面。现在 __doPostBack("", "");我猜方法是申请主页而不是那个ascx页面。你说什么??
【解决方案3】:

您可以在按钮点击时使用此 JavaScript 函数:

<script>
                $("#btn").click(
                   function () {
                       window.top.location = "WebForm1.aspx";
                   });
</script>

我曾使用此功能在关闭弹出窗口时自动更新网格,如果您想查看该文章并想了解我如何使用此功能,则可以参考此链接:

http://www.c-sharpcorner.com/UploadFile/cd7c2e/how-to-auto-refresh-grid-view-on-closing-of-popup-menu/

许多其他文章和类似论坛可以在http://www.c-sharpcorner.com/ 上找到

【讨论】:

  • 对不起,我不是在找这个。我正在使用一个用户控件,在里面我有一个树视图,它将在检查节点后得到回发。该控件正在模型弹出扩展器中显示。现在回发发生时弹出窗口正在关闭和打开
【解决方案4】:

我使用 AsyncPostBackTrigger 运行服务器端代码并​​更改了 __DoPostBack 方法参数。现在我的树视图设计是

<div id="form" runat="server">
<asp:UpdatePanel ID="updTree" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
        <asp:TreeView ID="tvFolderSelect" runat="server" RootNodeStyle-ForeColor="Black"
            CssClass="foldertree" LeafNodeStyle-ForeColor="Black" LeafNodeStyle-Font-Bold="false"
            ParentNodeStyle-ForeColor="Black" Width="100%" Style="margin: 3px 0 0 -16px;"
            OnTreeNodePopulate="tvFolderSelect_TreeNodePopulate" OnTreeNodeCheckChanged="tvFolderSelect_TreeNodeCheckChanged"
            ShowCheckBoxes="All" onclick="postbackOnCheck(event);">
            <LeafNodeStyle Font-Bold="False" ForeColor="Black" CssClass="foldertreeleafnode"
                ImageUrl="~/images/img_dms/sm_fldr.png" />
            <ParentNodeStyle Font-Italic="True" ImageUrl="~/images/img_dms/sm_fldr.png" Font-Underline="True"
                CssClass="foldertreeparentnode" />
            <NodeStyle Font-Names="Tahoma" Font-Size="8pt" ForeColor="Black" HorizontalPadding="0px"
                NodeSpacing="0px" VerticalPadding="0px" />
            <RootNodeStyle ForeColor="Black" CssClass="foldertreerootnode" />
            <SelectedNodeStyle Font-Underline="False" HorizontalPadding="0px" VerticalPadding="0px" />
        </asp:TreeView>
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="tvFolderSelect" EventName="TreeNodeCheckChanged" />
    </Triggers>
</asp:UpdatePanel>

回发的功能是

  function postbackOnCheck(e) {
    var evt = e || window.event;
    var o = evt.target || evt.srcElement;
    if (o.tagName == 'INPUT' && o.type == 'checkbox' && o.name != null && o.name.indexOf('CheckBox') > -1) {
        __doPostBack('<%=updTree.ClientID %>', 'Refresh:0,1,2');
    }
}

现在我的面板在回发时没有关闭

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2014-05-04
    • 1970-01-01
    • 1970-01-01
    • 2021-10-05
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多