asp.net-mvc ASP.Net MVC 加载进度指示器
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/287014/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
ASP.Net MVC Loading In Progress Indicator
提问by SaaS Developer
I have an MVC Controller that runs through a process, sets some View Data, and then returns the results of this data back to the user in a View. The process time is dependent on the amount of data that is being processed. I need a good way to display an animated .gif within the View while the process is running, letting the user know that something is going on.
我有一个 MVC 控制器,它运行一个进程,设置一些视图数据,然后将此数据的结果返回给视图中的用户。处理时间取决于正在处理的数据量。我需要一种很好的方法在进程运行时在视图中显示动画 .gif,让用户知道正在发生的事情。
I've looked at various AJAX methods and partial views but still cannot find a good way to accomplish this. What I really wished I could do was have an ActionFilter that would return a View or Partial View during the OnActionExecuting event that displays this animated .gif, then once the Controller completed processsing and returned the ViewData, the view or partial view with the actual View Data could be displayed.
我查看了各种 AJAX 方法和部分视图,但仍然找不到实现此目的的好方法。我真正希望我能做的是有一个 ActionFilter,它会在 OnActionExecuting 事件期间返回一个视图或部分视图,显示这个动画 .gif,然后一旦控制器完成处理并返回 ViewData,视图或部分视图与实际视图可以显示数据。
It also seems like jQuery would be able to provide a nice asynchronous way to call the controller action in the background and then render the View. Any help would be appreciated.
jQuery 似乎也能够提供一种很好的异步方式来在后台调用控制器操作,然后呈现视图。任何帮助,将不胜感激。
回答by Tim Scott
In your controller:
在您的控制器中:
public JsonResult GetSomething(int id)
{
return Json(service.GetSomething(id));
}
In the view (javascript, using JQuery):
在视图中(javascript,使用 JQuery):
$('#someLink').click(function()
{
var action = '<%=Html.ResolveUrl("~/MyController.mvc/GetSomething/")%>' + $('#someId').val() + '?x=' + new Date().getTime();
$('#loading').show()
$.getJSON(action, null, function(something)
{
do stuff with something
$('#loading').hide()
});
});
Note that this assumes a route where 'id' comes after action. The 'x' parameter on the action is to defeat aggressive caching in IE.
请注意,这假设了一条“id”在行动之后出现的路线。动作中的“x”参数是为了打败 IE 中的主动缓存。
In the view (markup):
在视图(标记)中:
<img id="loading" src="images/ajax-loader.gif" alt=""/>
<!-- use a css stlye to make display:none -->
Get loader gifs here.
在此处获取装载机 gif 。
Also note that you do not have to do this with Json. You can fetch other things like HTML or XML from the controller action if you prefer.
另请注意,您不必使用 Json 执行此操作。如果您愿意,您可以从控制器操作中获取其他内容,例如 HTML 或 XML。

