jquery.pagination +JSON 动态无刷新分页

<%@ 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>

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");
    }
   
}

posted on 2013-08-18 04:12 米高佐敦阅读(372) 评论(0) 编辑收藏举报