Question

我有一个网页需要几分钟才能加载。原因是这个页面包含一个ASP.NET网格视图，这个网格的数据绑定需要很多时间。

每个网格视图记录都包含一些复杂的用户详细信息，并显示了与用户首选项相关的项目数。根据用户偏好进行此计数是对数据检索存储过程的非常昂贵的操作。我认为这是让这个页面长时间加载的原因。

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

任何人都可以了解我如何使用asp.net网格视图实现此解决方案？

Answer 1

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

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

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

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

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

步骤2.添加JavaScript 然后需要一个JavaScript来将渲染和数据绑定的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 我们需要实现接口来打开客户端回调功能。

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

步骤4.绑定回叫参考 在步骤2中放置在JavaScript函数中的文字控件必须包含客户端回调引用。将以下内容添加到Page_Load。

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

步骤5.绑定网格并返回呈现的HTML 要完成异步加载，我们必须实现我们在步骤3中实现的ICallbackEventHandler接口定义的两个方法。其中一个方法将DataTable绑定到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();
 }
}

您可以使用当前的数据绑定方法绑定GridView。重要的是，GridView是RaiseCallbackEvent方法呈现控件之前的数据绑定。

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

价：http://madskristensen.net/post/Asynchronous-GridView-in-5-simple-steps

从异步调用加载asp.net网格视图

1 个答案: