当前位置:Gxlcms > mysql > jQuery自动加载更多程序

jQuery自动加载更多程序

时间:2021-07-01 10:21:17 帮助过:27人阅读

1.1.1 摘要 现在,我们经常使用的微博、微信或其他应用都有异步加载功能,简而言之,就是我们在刷微博或微信时,移动到界面的顶端或低端后程序通过异步的方式进行加载数据,这种方式加快了数据的加载速度,由于它每次只加载一部分数据,当我们有大量的数据,

1.1.1 摘要

现在,我们经常使用的微博、微信或其他应用都有异步加载功能,简而言之,就是我们在刷微博或微信时,移动到界面的顶端或低端后程序通过异步的方式进行加载数据,这种方式加快了数据的加载速度,由于它每次只加载一部分数据,当我们有大量的数据,但不能显示所有,这时我们可以考虑使用异步方式加载数据。

数据异步加载可以发生在用户点击“查看更多”按钮或滚动条滚动到窗口的底部时自动加载;在接下来的博文中,我们将介绍如何实现自动加载更多的功能。

本文目录

image

图1 微博加载更多功能

1.1.2 正文

假设,在我们的数据库中存放着用户的消息数据,现在,我们需要通过Web Service形式开放API接口让客户端调用,当然我们也可以使用一般处理程序(ASHX文件)让客户端调用(具体请参考这里)。

数据表

首先,我们在数据库中创建数据表T_Paginate,,它包含三个字段ID、Name和Message,其中ID是自增值。

-- ============================================= -- Author: JKhuang -- Create date: 10/28/2013 -- Description: A table stores the user information. -- ============================================= CREATE TABLE [dbo].[T_Paginate]( [ID] [int] IDENTITY(1,1) NOT NULL, [Name] [varchar](60) COLLATE Chinese_PRC_CI_AS NULL, [Message] [text] COLLATE Chinese_PRC_CI_AS NULL, CONSTRAINT [PK_T_Paginate] PRIMARY KEY CLUSTERED ( [ID] ASC IGNORE_DUP_KEY [PRIMARY] ) ON [PRIMARY] TEXTIMAGE_ON [PRIMARY]

LoadMore0

图2 数据表T_Paginate

数据对象模型

我们根据数据表T_Paginate定义数据对象模型Message,它包含三个字段分别是:Id、Name和Comment,具体定义如下:

/// /// The message data object. /// [Serializable] public class Message { public int Id { get; set; } public string Name { get; set; } public string Comment { get; set; } } Web Service方法

现在,我们需要实现方法GetListMessages(),它根据客户端传递来的分页数来获取相应的分页数据并且通过JSON格式返回给客户端,在实现GetListMessages()方法之前,我们先介绍数据分页查询的方法。

在Mysql数据库中,我们可以使用limit函数实现数据分页查询,但在SQL Server中没有提供类似的函数,那么,我们可以发挥人的主观能动——自己实现一个吧,具体实现如下:

-- ============================================= -- Author: JKhuang -- Create date: 10/26/2013 -- Description: Creates a pagination function -- ============================================= Declare @Start AS INT Declare @Offset AS INT ;WITH Results_CTE AS ( ROW_NUMBERID) AS RowNum FROM T_Paginate WITH(NOLOCK)) Results_CTE WHERE RowNum BETWEEN @Start AND @Offset

上面我们定义了公用表表达式Results_CTE,它获取T_Paginate表中的数据并且根据ID值由小到大排序,然后根据该顺序分配ROW_NUMBER值,其中@Start和@Offset是要查询的数据范围。

接下来,让我们实现方法GetListMessages(),具体实现如下:

/// /// Get the user message. /// /// the pagination number /// the pagination data [WebMethod] [ScriptMethod(ResponseFormat = ResponseFormat.Json)] public string GetListMessages(int groupNumber) { string query = string.Format("WITH Results_CTE AS (SELECT ID, Name, Message, ROW_NUMBER() OVER (ORDER BY ID) AS RowNum " + "FROM T_Paginate WITH(NOLOCK)) " + "SELECT * FROM Results_CTE WHERE RowNum BETWEEN '{0}' AND '{1}';", (groupNumber - 1) * Offset + 1, Offset * groupNumber); var messages = new List(); using (var con = new SqlConnection(ConfigurationManager.ConnectionStrings["RadditConn"].ToString())) using (var com = new SqlCommand(query, con)) { con.Open(); using (var reader = com.ExecuteReader(CommandBehavior.CloseConnection)) { while (reader.Read()) { var message = new Message { Id = (int)reader["ID"], Name = (string)reader["Name"], Comment = (string)reader["Message"] }; messages.Add(message); } } // Returns json data. return new JavaScriptSerializer().Serialize(messages); } }

人气教程排行