Question

我有很长的操作，它从我的Active Directory中检索数据，然后在MVC视图中将这些数据显示为表格。所有工作除了需要20秒才能显示数据。我有问题如何在数据加载时避免UI阻塞和显示微调器。

Answer 1

您可以显示加载grpahic，然后进行ajax调用以获取数据，当您收到异步ajax调用的响应时，向用户显示并隐藏（或替换）加载图像。

<div id="userTable">
  <p>Loading...</p>
  <img src="~/Content/images/loadingimage.png" alt="Please wait" />
</div>

并在文档就绪事件中进行ajax调用以获取所需的数据。您可以使用jquery load()方法。

$(function(){
   $("#userTable").load("@Url.Action("UserList","Users")");
});

假设UserList()中的UsersController操作方法将返回包含用户列表的表格数据标记的部分视图。

public ActionResult UserList()
{
   var useViewModelList = new List<YourUserViewModel>();
   useViewModelList.Add(new YourUserViewModel { Name="Scott" });
   return PartialView(useViewModelList);
}

在你的局部视图中（〜/ Views / Shared / UserList.cshtml），

@model List<YourUserViewModel>
<table>
  <tr><th>Name</th></tr>
  @foreach(var item in Model)
  {
    <tr><td>@item.Name</td></tr>
  }
</table>

如何在加载数据时在MVC中显示微调器

1 个答案: