jquery.pagination +JSON 动态无刷新分页实现代码

  aspx 页面:

  

复制代码 代码如下:

  <%@ Page Language="C#" AutoEventWireup="true" CodeFile="SqlPage.aspx.cs" Inherits="SqlPage" %>

  <!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 runat="server">

  <title></title>

  <link href="css/pagination.css" rel="stylesheet" type="text/css" />

  </head>

  <body>

  <form id="form1" runat="server" >

  <div>

  <table id="tblData" width="80%" cellpadding="1" cellspacing="1" bgcolor="gray" style="text-align:center">

  <tr>

  <td>

  NewsID

  </td>

  <td>

  Title

  </td>

  <td>

  SmallClassName

  </td>

  <td>

  Author

  </td>

  <td>

  UpdateTime

  </td>

  </tr>

  </table>

  <div id="Pagination">

  </div>

  </div>

  </form>

  </body>

  </html>

  <script src="js/jquery-1.4.2.min.js" type="text/javascript"></script>

  <script src="js/jquery.pagination.js" type="text/javascript"></script>

  <script language="javascript" type="text/javascript">

  var pageIndex =0; //页索引

  var pageSize =20; //每页显示的条数

  $(function() {

  Init(0);

  $("#Pagination").pagination(<%=pageCount %>, {

  callback: PageCallback,

  prev_text: '上一页',

  next_text: '下一页',

  items_per_page: pageSize,

  num_display_entries: 5,

  current_page: pageIndex,

  num_edge_entries: 1

  });

  function PageCallback(index, jq) {

  Init(index);

  }

  });

  function Init(pageIndex) {

  $.ajax({

  type: "POST",

  dataType: "text",

  url: 'SqlPage.aspx',

  data: "pageIndex=" + (pageIndex + 1) + "&pageSize=" + pageSize,

  success: function(data) {

  if(data!=""){

  $("#tblData tr:gt(0)").remove();//移除所有的数据行

  data=$.parseJSON(data);

  $.each(data.News,function(index,news){

  $("#tblData").append("<tr bgcolor='white'><td>"+news.NewsID+"</td><td algin='left'>"+news.Title+"</td><td>"+news.SmallClassName+"</td><td>"+news.Author+"</td><td>"+news.Updatetime+"</td></tr>"); //将返回的数据追加到表格

  });

  }

  }

  });

  }

  </script>

  cs代码:

  

复制代码 代码如下:

  using System;

  using System.Collections.Generic;

  using System.Linq;

  using System.Web;

  using System.Web.UI;

  using System.Web.UI.WebControls;

  using System.Data;

  public partial class SqlPage : System.Web.UI.Page

  {

  public int pageCount = 0;

  public static string connString = "server=192.168.1.91;database=ReportDB;uid=sa;pwd=123456";

  protected void Page_Load(object sender, EventArgs e)

  {

  if (!IsPostBack)

  {

  pageCount = GetTotalPage();

  if (Request["pageIndex"] != null && Request["pageSize"] != null)

  {

  int pageSize = Convert.ToInt32(Request["pageSize"]) == 0 ? 1 : Convert.ToInt32(Request["pageSize"]);

  int pageIndex = Convert.ToInt32(Request["pageIndex"]) == 0 ? 1 : Convert.ToInt32(Request["pageIndex"]);

  Response.Write(GetOnePage(pageSize, pageIndex));

  Response.End();

  }

  }

  }

  public int GetTotalPage()

  {

  DBHelper.connString = connString;

  string sql = "select count(*) from News";

  int rs = Convert.ToInt32(DBHelper.ExecuteScalar(sql));

  return rs;

  }

  public string GetOnePage(int pageSize, int pageIndex)

  {

  DBHelper.connString = connString;

  string sql = string.Empty;

  sql = "SELECT TOP " + pageSize + " NewsID,Title,SmallClassName,Author,Updatetime FROM News WHERE NewsID NOT IN (SELECT TOP " + pageSize * (pageIndex - 1) + " NewsID FROM News ORDER BY NewsID DESC) ORDER BY NewsID DESC";

  DataTable dt = DBHelper.QueryBySql(sql);

  return ConvertJson.ToJson(dt, "News");

  }

  }