在页面呈现时显示Ajax Loader

Question

这可能是一个简单的问题，但是如何最好地使用ASP.NET中的AJAX加载器在页面构建时提供加载对话框？

我目前有一个UpdatePanel和一个关联的UpdateProgressPanel，它包含ProgressTemplate中的加载消息和gif。

目前我有一个页面，onLoad（）去获取业务实体，然后显示它们。当它这样做时，我想显示一个AJAX加载器。

在页面加载中没有任何内容并且有一个隐藏的按钮触发onLoadComplete或unLoad（），然后等待按钮单击方法完成显示UpdateProgressPanel会更好吗？

Answer 1

我已经做了类似的Timer控件。你的OnLoad只打开计时器，页面完成渲染。然后计时器（有一些最小的间隔值）完成肮脏的工作，正确显示进度面板。切记关闭计时器作为该过程的最后一步。

Answer 2

您可以在.Net以外的HTML中执行此操作。在你的ASPX页面你有这样的代码：

 
<div id="loading">
 
<!-- Animated GIF or other indication that stuff is happening -->
 
</div> 

在你的页面的最下方，右侧前你可以有一个代码片段看起来像这样：

 
<script language="javascript">
 
    document.getElementById("loading").style.display = "none";
 
</script> 

图形---只要它在页面的顶部---将首先渲染。然后，所有onLoad内容都会发生，最后内联JavaScript将在页面底部发生。

很多时候我会禁用处于未加载状态的按钮，并在底部的JavaScript中启用它们。这可以防止用户在页面准备好之前获得点击高兴和触发事件。

Answer 3

如果你真的想要细粒度的控制，你可以使用基于progressbar的AJAX预加载器。您可以对其进行配置，以便每次状态发生变化时都能完成。即从0到4（5个就绪状态），每个状态进行20％。创建一个非常简单。有一个容器div其中持有另一个div其width从0到100％的变化为每个州20％的步骤。为内部div添加背景色（例如：蓝色），使其看起来像它的进度。 GMail我猜想它的预装载器使用了类似的方法。

Answer 4

该帖子旧，但你可以看看http://ajax.net-tutorials.com/controls/updateprogress-control/