MVC 4 - 加载消息或图形
本文关键字:图形 消息 加载 MVC | 更新日期: 2023-09-27 18:34:30
是否可以在处理函数时显示加载消息或图形?
我目前有一个控制器,它可以在返回视图之前执行所有功能。但是,由于该功能的一部分包括ServerXMLHTTP进程,因此在连接到第三方服务器时可能需要30秒以上。对于用户来说,这显然不理想,他们在等待xmlHttp.readyState
完成时观察到空白屏幕。
任何帮助将不胜感激:-(
这是一个在页面之间插入自身的 JavaScript 加载页面的示例。此代码在加载之前放置在页面上。我使用了一个简单的提交按钮来提交我的搜索查询。你可以从这里获取ajax加载gif:
http://www.ajaxload.info/
<div id="divLoading" style="margin: 0px; padding: 0px; position: fixed; right: 0px;
top: 0px; width: 100%; height: 100%; background-color: #666666; z-index: 30001;
opacity: .8; filter: alpha(opacity=70);display:none">
<p style="position: absolute; top: 30%; left: 45%; color: White;">
Loading, please wait...<img src="../../Content/themes/base/images/ajax-loading.gif">
</p>
</div>
<button type="submit" class="btn btn-success" onclick="JavascriptFunction()"value="filter" name="searchQuery">SUBMIT</button>
<script type="text/javascript" language="javascript">
function JavascriptFunction() {
var url = '@Url.Action("PostMethod", "Home")';
$("#divLoading").show();
$.post(url, null,
function (data) {
$("#PID")[0].innerHTML = data;
$("#divLoading").hide();
});
}
</script>
基本上,当用户单击提交按钮时,加载器会出现,直到加载下一个方法/数据/视图。
我发现这个解决方案非常适合我的需求,请参阅http://blog.michaelckennedy.net/2012/11/13/improve-perceived-performance-of-asp-net-mvc-websites-with-async-partialviews/
,因为这最有帮助。