Question

我正在使用asp ModalPopupExtender在asp.net页面中显示树视图。当我单击一个按钮时，将引发ModalPopupExtender并使用复选框加载树视图（加载treeview是一个usercontrol 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弹出窗口。

Answer 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>

希望这有帮助。

Answer 2

尝试使用更新面板并参考下面的链接，了解为什么Modalpopup关闭回发的详细信息？

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

Answer 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/

上可以找到许多其他文章和类似论坛

Answer 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');
    }
}

现在我的小组在收到回发时没有关闭

当页面获得回发时，asp ModalPopupExtender正在关闭

4 个答案: