DataGrid功能强大，我们只用写几行代码就能够实现复杂的页面数据显示。数据多的时候免不了要分页显示，DataGrdi本身自带分页功能，但是当数据量少的时候很方便，当大数据量时，DataGrid得分页机制就不太好了。于是在网上找到了一种比较好的利用存储过程实现分页机制(客户端想要第几页就取第几页数据，上十万级的数据查询也很快，数据量再多的时候就没试过了，等有时间把利用存储过程分页也写在blog上)在工作中为了让客户用的更舒服点，也赶时髦，想利用Ajax来实现DataGrid无刷新分页。主要用RenderControl方法把DataGrid翻译成Html代码，然后用Web Service 返回。当然也可以用别的方法。
GenericAjaxWS.asmx.cs
1
//GenericAjaxWS.asmx.cs
2using System;
3using System.Collections;
4using System.ComponentModel;
5using System.Data;
6using System.Data.SqlClient;
7using System.Diagnostics;
8using System.Web;
9using System.Web.Services;
10using System.Configuration;
11using System.Web.UI.WebControls;
12using System.Web.UI;
13using System.IO;
14namespace GenricAjaxWS
15![]()
2
3
4
5
6
7
8
9
10
11
12
13
14
15
上面的是Web服务，然后利用Ajax请求这个服务来获取要现实的数据。以下是客户端JavaScript代码：
AjaxFuncs.js
1//声明异步请求对象
2/////////////////////////////////////////////////////////////////
3var xmlhttp;
4/////////////////////////////////////////////////////////////////
5//填充DataGrid,这个函数有3个参数。
6//第一个是包含DataGrid的DIV的ID
7//第二个是查询数据的sql语句
8//第三个是要获取第几页数据
9
10/////////////////////////////////////////////////////////////////
11var ph;
12var fil lG rid_Str_SQL="";
13var currentPageIndex ;
14![]()
}
最后就是显示数据的html页面，实例代码如下：2
3
4
5
6
7
8
9
10
11
12
13
14
AjaxGrid.html：
1
2<html>
3 <head>
4 <title>AjaxGrid</title>
5 <script language="javascript"
6 type="text/javascript" src="ajaxFuncs.js"></script>
7 </head>
8 <body onload="fil lG rid('myPH','select * from sales',1)">
9
10 <form id="Form1" method="post" runat="server">
11 <div id="myPH" ></div>
12 </form>
13 </body>
14</html>
2
3
4
5
6
7
8
9
10
11
12
13
14