如何使用慢速加载助手显示加载指示器？

Question

我在部分内部有一个帮助器，我正在加载这样的东西：

public ActionResult TimeLine(Guid documentId)
{
//This code takes no time to load 
var document = _someService.GetById(documentId);

return PartialView(document);
}

TimeLine局部视图包含一个需要一段时间才能处理的自定义帮助程序。我想知道在构建帮助程序时显示某种加载消息的好方法是什么。我试图隐藏/显示div，但由于服务器调用帮助程序首先运行，这是没有意义的。

有一种想法是可能会预先加载帮助程序的所有数据，这可能允许我在加载数据时显示/隐藏某些内容？

Answer 1

在主视图中显示容器div中的加载图像，然后使用jQuery加载在文档就绪时将局部视图提供给它。

主视图

<div id="partialViewContainer">
   <img src="loading.gif" alt='loading'/>Loading...
</div>

<强>脚本

$(function(){
   var docId=$("DocumentID").val(); // read the id from some hidden input
   $("#partialViewContainer").load("controller/TimeLine/"+docId);

});