使用 AJAX 重新绑定 gridview（无回发）答案

【问题标题】：Rebind gridview using AJAX (without post back)使用 AJAX 重新绑定 gridview（无回发）
【发布时间】：2011-05-01 13:17:06
【问题描述】：

我计划允许用户打开一个modalpopupextender，其中包含一个带有过滤器文本框的gridview。我想要它，所以当用户输入过滤器时，过滤器将应用于网格视图，然后更新网格视图的内容以反映应用的过滤器 - 所有这些都无需回发。理想情况下，gridview 将在用户键入时被过滤，而不必按下按钮。

我猜它会在我的 SqlDataSource 和 UpdatePanel 上使用 FilterParameters，但谁能提供更全面的解释来说明我将如何做到这一点？如果我使用的代码是“通用的”并且可以与任何其他 GridView 和 DataSource 一起使用，那就太好了。

谢谢

【问题讨论】：

标签： c# asp.net ajax gridview sqldatasource

【解决方案1】：

将gridview 放在UpdatePanel 中，TextBox 放在它外面。向该面板添加一个隐藏按钮，这是一个异步触发器，然后将 javascript onchange 添加到文本框以单击该按钮。

  <asp:Button ID="DoRefresh" style="display:none;" UseSubmitBehavior="false"
 runat="server" OnClick="Recalculate()" />

在 Page_Init 中：

    myTextBox.Attributes.Add("onChange",
"document.getElementById('" + DoRefresh.ClientID + "').click()");

将重新绑定代码放入Recalculate()

应该这样做。我相信有更好的方法可以做到这一点，但如果你想使用像 GridView 这样的服务器端控件，我认为你会遇到部分回发来更新它。不过要小心，您确定要在他们每次输入字母时运行查询吗？

编辑 - 让我补充一点，我认为使用 jQuery 插件或其他带有 ajax 的客户端解决方案，正如另一个答案所暗示的那样，这样做比这样做更有意义。这并不是 UpdatePanels 的真正用途，每次他们键入字母时，您都会进行回发（尽管是部分的）。但是回发是告诉服务器端代码更新页面的唯一方法。

【讨论】：

【解决方案2】：

每次用户键入字母时，您都将访问服务器并运行查询。那会很快变得昂贵。你在使用像 jQuery 这样的 JavaScript 框架吗？大多数框架都会有一个数据表，它包含具有这种功能的 <table> 标记。

通过 google 快速搜索找到 jQuery：http://www.datatables.net/ （还有很多其他的，道场和yui也有自己的）

你可以这样做：

$(document).ready(function(){
  $('#<% = GridView1.ClientID%>').dataTable();
});

请注意，根据数据集的大小，此解决方案也有其缺点。

【讨论】：

【解决方案3】：

难道你不能将 gridview 包装在更新面板中，然后在文本框更改上重新绑定数据源和过滤器吗？

【讨论】：