您的位置：首页 > 其它

利用Ajax实现DataGrid无刷新分页

2007-11-05 20:40 155 查看

[align=left]DataGrid功能强大，我们只用写几行代码就能够实现复杂的页面数据显示。数据多的时候免不了要分页显示，DataGrdi本身自带分页功能，但是当数据量少的时候很方便，当大数据量时，DataGrid得分页机制就不太好了。于是在网上找到了一种比较好的利用存储过程实现分页机制(客户端想要第几页就取第几页数据，上十万级的数据查询也很快，数据量再多的时候就没试过了，等有时间把利用存储过程分页也写在blog上)在工作中为了让客户用的更舒服点，也赶时髦，想利用Ajax来实现DataGrid无刷新分页。主要用RenderControl方法把DataGrid翻译成Html代码，然后用Web Service 返回。当然也可以用别的方法。[/align]
[align=left]GenericAjaxWS.asmx.cs[/align]
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
[align=left]上面的是Web服务，然后利用Ajax请求这个服务来获取要现实的数据。以下是客户端JavaScript代码：[/align]
[align=left]AjaxFuncs.js[/align]

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

56function fillGrid_Change()

57

70

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>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航