asp.net - 从异步调用加载 asp.net GridView

Question

我有一个需要几分钟才能加载的网页。原因是此页面包含一个 ASP.NET GridView ，并且此网格的数据绑定(bind)需要花费大量时间。

每个 GridView 记录都包含一些复杂的用户详细信息，并且显示了与用户偏好相关的项目数。根据用户偏好进行此计数是对数据检索存储过程的相当昂贵的操作。我认为这就是加载此页面需要很长时间的原因。

作为解决方案，我想到了加载没有特定网格记录计数的 GridView (从数据检索存储过程中删除计数操作)。并通过对服务器的异步调用更新每个网格记录的计数标签。

谁能知道我如何使用 asp.net GridView 准确地实现此解决方案？

Answer 1

具有数据绑定(bind) GridView 控件的网页可能需要很长时间才能加载。直到所有控件都呈现页面才会呈现，并且在从数据库检索数据之前 GridView 无法呈现。因此，让我们异步加载 GridView，让页面加载更快，感知速度更快。

这个小技巧其实很简单，涉及到ASP.NET内置的客户端回调功能。尽管我不是那个特定功能的忠实粉丝，但它有时会非常方便。最好的部分是您不必对现有代码进行太多更改。网页

在托管 GridView 控件的网页上，您必须进行 2 处小更改。

第 1 步. 封装 GridViewGridView 控件必须由具有 id 属性的 HTML 控件封装，以便它可以被 JavaScript 引用。这是因为当没有数据绑定(bind)到 GridView 时，它不会呈现。

<div id="grid">
 <span>Loading...</span>
 <asp:GridView runat="Server" ID="gvAsync" />
</div>

第 2 步。添加 JavaScript然后需要一个 JavaScript 将呈现的和数据绑定(bind)的 GridView 加载到我们在步骤 1 中添加的 HTML 控件。将 JavaScript 放在 GridView 周围的 div 标记下方。

<script type="text/javascript">
function EndGetData(arg)
{
 document.getElementById("grid").innerHTML = arg;
}

setTimeout("<asp:literal runat="server" id="ltCallback" />", 100);
</script>

代码隐藏

在代码隐藏文件中，需要执行三个小步骤。

第 3 步。实现 ICallbackEventHandler我们需要实现接口(interface)来开启客户端回调功能。

public partial class asyncgridview : System.Web.UI.Page, ICallbackEventHandler

第四步.绑定(bind)回调引用在步骤 2 中放置在 JavaScript 函数中的文本控件必须包含客户端回调引用。将以下内容添加到 Page_Load。

if (!Page.IsCallback)
 ltCallback.Text = ClientScript.GetCallbackEventReference(this, "'bindgrid'", "EndGetData", "'asyncgrid'", false);

第 5 步. 绑定(bind)网格并返回呈现的 HTML要完成异步加载，我们必须实现我们在步骤 3 中实现的 ICallbackEventHandler 接口(interface)定义的两个方法。其中一个方法将 DataTable 绑定(bind)到 GridView 并呈现控件。第二个将呈现的 HTML 返回到我们在步骤 2 中定义的 JavaScript 方法。

privatestring _Callback;

publicstring GetCallbackResult()
{
 return _Callback;
}

publicvoid RaiseCallbackEvent(string eventArgument)
{
 DataTable table = RetrieveDataTableFromDatabase();
 gvAsync.DataSource = table;
 gvAsync.DataBind();

 using (System.IO.StringWriter sw =new System.IO.StringWriter())
 {
  gvAsync.RenderControl(new HtmlTextWriter(sw));
  _Callback = sw.ToString();
 }
}

您可以使用现有的数据绑定(bind)方法来绑定(bind)GridView。重要的部分是 GridView 在 RaiseCallbackEvent 方法呈现控件之前是数据绑定(bind)的。

相同的技术可用于所有数据控件，例如 Repeater、FormView 和 DataList。

引用:http://madskristensen.net/post/Asynchronous-GridView-in-5-simple-steps