AJAX实现无刷新分页

最新推荐文章于 2024-05-15 22:45:03 发布

原创最新推荐文章于 2024-05-15 22:45:03 发布 · 507 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#ajax #action #服务器 #function #webservice #string

ASP.Net 专栏收录该内容

10 篇文章

订阅专栏

1.新建T_PingLun表的强类型DataSet，在其中添加两个方法，一个是得到评论的总条数SelectCount，SQL语句如下：

SELECT COUNT(*) FROM T_PingLun

另一个是根据客户端传过来的当前页码数来选择第startRowIndex条到第endRowIndex条评论的方法GetPageData，具体SQL语句如下：

select * from ( SELECT Id, Comment, CreateDate,Row_Number() over(order by CreateDate desc) rownum FROM dbo.T_PingLun )t where t.rownum>=@startRowIndex and t.rownum<=@endRowIndex

注意不要忘了在此方法的属性面板中手动添加startRowIndex和endRowIndex这两个参数。

2.新建一般处理程序CountAndPagedData.ashx，该程序通过客户端的请求参数来区分是请求总页数还是请求每页的内容。客户端的请求参数action有两个取值，如果action == "getpagecount"，则表明客户端想得到总的页码数；如果action == "getpagedata"，则表明客户端想得到页的内容，此外，客户端还得有一个请求参数pagenum，来表示要请求的是第几页的内容。假如数据库中总共有15条评论，pagenum=2，根据GetPageData方法可知，startRowIndex=(2-1)*10+1，endRowIndex=2*10，也就是服务器向客户端发送第11到15条的评论。

具体实现方法如下：

using System; using System.Collections; using System.Data; using System.Linq; using System.Web; using System.Web.Services; using System.Web.Services.Protocols; using System.Xml.Linq; using AJAX.DAL.DataSetPingLunTableAdapters; using System.Collections.Generic; using System.Web.Script.Serialization; namespace AJAX.无刷新分页 { /// <summary> /// $codebehindclassname$ 的摘要说明 /// </summary> [WebService(Namespace = "http://tempuri.org/")] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] public class CountAndPagedData : IHttpHandler { public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; string action=context.Request["action"]; //客户端请求总页数 if (action == "getpagecount") { T_PingLunTableAdapter adapter = new T_PingLunTableAdapter(); int commentCount = adapter.SelectCount().Value; int pageCount = commentCount / 10; if (pageCount != 0) { pageCount++; } context.Response.Write(pageCount); } else if (action == "getpagedata")//客户端请求每页的内容 { //请求的页码pagenum string strPageNum=context.Request["pagenum"]; int iPageNum = Convert.ToInt32(strPageNum); T_PingLunTableAdapter adapter = new T_PingLunTableAdapter(); var data = adapter.GetPageData((iPageNum-1)*10+1,iPageNum*10); //JavaScriptSerializer无法序列化DataTable类型的数据，所以先声明 //一个PingLun类，把data中的每行数据都转化为相应的PingLun类中的字段值 //然后加到list中。 List<PingLun> list = new List<PingLun>(); foreach (var row in data) { list.Add(new PingLun() { Comment=row.Comment, PostDate=row.CreateDate.ToShortDateString()}); } //对list进行序列化 JavaScriptSerializer jss = new JavaScriptSerializer(); context.Response.Write(jss.Serialize(list)); } } public bool IsReusable { get { return false; } } } public class PingLun { public string PostDate { get; set; } public string Comment { get; set; } } }

3.新建一个静态页面wsxfy.htm。首先要建一个空的ul，把服务器传过来的数据放到ul中。还要建一个table，只有一行，每行的单元格内容即是页码数字。

内容如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>无标题页</title> <mce:script src="../js/jquery-1.4.2.js" mce_src="js/jquery-1.4.2.js" type="text/javascript"></mce:script> <mce:script type="text/javascript"></mce:script> </head> <body> <ul id="ulComment"> </ul> <table id="tablePage"> <tr id="trPage"></tr> </table> </body> </html>