ASP.Net在新页面上显示加载叠加

Question

I currently have two pages in my ASP.net web forms site. 我目前在ASP.net网站表单站点中有两个页面。 On the first page the user can enter some details and then press a button. 用户可以在第一页上输入一些详细信息，然后按一个按钮。 This will then response.redirect to the next page sending the user details with it. 然后，这将response.redirect重定向到下一个页面，发送用户详细信息。

This next page has a page load of 下一页的页面加载为

protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {   
            GetInformation();        
        }
    }

GetInformation() does a long processing using those user details that takes about 15-20 seconds. GetInformation（）使用这些用户详细信息进行长时间的处理，大约需要15-20秒。

What happens is when the user presses the button on the first page, it stays on the first page until the GetInformation() has finished running, then it will load the new page. 发生的情况是，当用户按下第一页上的按钮时，该按钮一直停留在第一页上，直到GetInformation（）完成运行，然后它将加载新页面。

What I want to do is, when the user presses the button, the new page appear and then have an overlay saying loading or something, and then have it start GetInformation(). 我想做的是，当用户按下按钮时，将出现新页面，然后有一个叠加层显示正在加载内容或某些内容，然后让它启动GetInformation（）。 Once GetInformation has finished the overlay will disappear. GetInformation完成后，叠加层将消失。

I have done a search around on Google and seen some ideas but none of them seem to really fit to my problem. 我在Google上进行了搜索，发现了一些想法，但是似乎没有一个真的适合我的问题。

What would be the best way to go about doing this? 这样做的最佳方法是什么？

Answer 1

Very simple solution: 很简单的解决方案：

Create a new page Loading.aspx . 创建一个新页面Loading.aspx 。 Add appropriate styles and everything so that it looks like your expected loading page. 添加适当的样式和所有内容，使其看起来像您期望的加载页面。
In this page add the following tag within the <head> tag: <meta http-equiv="refresh" content="0;URL='LongLoadingPage.aspx'" /> 在此页面的<head>标记内添加以下标记： <meta http-equiv="refresh" content="0;URL='LongLoadingPage.aspx'" />

Now instead of redirecting to LongLoadingPage.aspx directly, redirect to the Loading.aspx page. 现在，而不是直接重定向到LongLoadingPage.aspx ，而是重定向到Loading.aspx页面。

Of course, this is a quick-n-dirty solution, there might be a better one where you initialize the long running operation using AJAX requests (using UpdatePanel or vanilla XMLHttpRequest ). 当然，这是一种快速的解决方案，在使用AJAX请求（使用UpdatePanel或vanilla XMLHttpRequest ）初始化长时间运行的操作时，可能会有更好的解决方案。

Answer 2

The page would be shown only after the page_load event has executed completely.So dont call ur function in the page_load event.Instead use a timer control to trigger ur function call. 该页面会显示只有在page_load事件已执行completely.So不叫乌尔功能在page_load event.Instead使用定时器控制触发UR函数调用。

Let say u add a timer control like 假设您添加了一个计时器控件，例如

<asp:Timer ID="tmr" runat="server" Interval="3000" OnTick="tmr_Tick" Enabled="true">
</asp:Timer>

Now server side code would some what look like this 现在服务器端代码将如下所示

protected void tmr_Tick(object sender, EventArgs e)
{
    tmr.Enabled = false;
    GetInformation();        
    loadingIndicator.Style.Add("display", "none");
}

Now in order to show loading indicator put a div like this on the page 现在，为了显示加载指示器，在页面上放置一个像这样的div

<div id="loadingIndicator" runat="server" style="background-image:url(ajax-loader-small.gif);background-repeat: no-repeat; width: 100%; height: 104px; background-position: center;">
</div>

the loading indicator will be showing by default and when the GetInformation() has finished executing we can change display 默认情况下将显示加载指示器，并且当GetInformation()完成执行后，我们可以更改显示

Hope this helps.... 希望这可以帮助....

ASP.Net在新页面上显示加载叠加

问题描述

2 个解决方案

解决方案1
1 2013-03-08 12:53:23

解决方案2
1 已采纳 2013-03-08 12:58:48

ASP.Net在新页面上显示加载叠加

问题描述

2 个解决方案

解决方案1 1 2013-03-08 12:53:23

解决方案2 1 已采纳 2013-03-08 12:58:48

解决方案1
1 2013-03-08 12:53:23

解决方案2
1 已采纳 2013-03-08 12:58:48