Ajax+Asp.Net无刷新分页

1、新建解决方案,并建立四个项目BLL,DAL,Model,PagerTest,如图所示:

2、Model代码

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;

namespace Model
{
    public class Person
    {
        /// <summary>
        /// 编号
        /// </summary>
        public int Id { get; set; }

        /// <summary>
        /// 名字
        /// </summary>
        public string Name { get; set; }
    }
}

3、DAL代码

SQlHelper.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Configuration;
using System.Data.SqlClient;
using System.Data;

namespace DAL
{
    public class SQlHelper
    {
        /// <summary>
        /// 执行非查询
        /// </summary>
        /// <param name="connectionString">连接字符串</param>
        /// <param name="cmdType">命令类型</param>
        /// <param name="cmdText">命令的文本</param>
        /// <param name="commandParameters">命令的参数</param>
        /// <returns>返回影响的结果集行数</returns>
        public static int ExcuteNonQuery(string connectionString, CommandType cmdType, string cmdText, params SqlParameter[] commandParameters)
        {
            SqlCommand cmd = new SqlCommand();

            using (SqlConnection conn = new SqlConnection(connectionString))
            {
                PrePareCommand(cmd, conn, null, cmdType, cmdText, commandParameters);
                int val = cmd.ExecuteNonQuery();
                cmd.Parameters.Clear();
                return val;
            }
        }

        /// <summary>
        /// 执行非查询
        /// </summary>
        /// <param name="connection">数据库连接</param>
        /// <param name="cmdType">命令的类型</param>
        /// <param name="cmdText">命令的文本</param>
        /// <param name="commandParameters">命令的参数</param>
        /// <returns>返回影响的结果集行数</returns>
        public static int ExcuteNonQuery(SqlConnection connection, CommandType cmdType, string cmdText, params SqlParameter[] commandParameters)
        {
            SqlCommand cmd = new SqlCommand();

            PrePareCommand(cmd, connection, null, cmdType, cmdText, commandParameters);
            int val = cmd.ExecuteNonQuery();
            cmd.Parameters.Clear();
            return val;
        }

        /// <summary>
        /// 执行非查询
        /// </summary>
        /// <param name="trans">事务</param>
        /// <param name="cmdType">命令的类型</param>
        /// <param name="cmdText">命令的文本</param>
        /// <param name="commandParameters">命令的参数</param>
        /// <returns>返回影响的结果集行数</returns>
        public static int ExcuteNonQuery(SqlTransaction tran, CommandType cmdType, string cmdText, params SqlParameter[] commandParameters)
        {
            SqlCommand cmd = new SqlCommand();
            PrePareCommand(cmd, tran.Connection, tran, cmdType, cmdText, commandParameters);

            int val = cmd.ExecuteNonQuery();
            cmd.Parameters.Clear();
            return val;
        }

        /// <summary>
        /// 执行查询
        /// </summary>
        /// <param name="connectionString">练级字符串</param>
        /// <param name="cmdType">命令的类型</param>
        /// <param name="cmdText">命令的文本</param>
        /// <param name="commandParameters">命令的参数数组</param>
        /// <returns>返回结果集</returns>
        public static SqlDataReader ExecuteReader(string connectionString, CommandType cmdType, string cmdText, params SqlParameter[] commandParameters)
        {
            SqlCommand cmd = new SqlCommand();
            SqlConnection conn = new SqlConnection(connectionString);
            try
            {
                PrePareCommand(cmd, conn, null, cmdType, cmdText, commandParameters);
                SqlDataReader sdr = cmd.ExecuteReader(CommandBehavior.CloseConnection);
                cmd.Parameters.Clear();
                return sdr;
            }
            catch
            {
                conn.Close();
                throw;
            }
        }

        /// <summary>
        /// 执行查询
        /// </summary>
        /// <param name="connectionString">练级字符串</param>
        /// <param name="cmdType">命令的类型</param>
        /// <param name="cmdText">命令的文本</param>
        /// <param name="commandParameters">命令的参数数组</param>
        /// <returns>返回结果集</returns>
        public static SqlDataReader ExecuteReader(SqlTransaction trans, CommandType cmdType, string cmdText, params SqlParameter[] commandParameters)
        {
            SqlCommand cmd = new SqlCommand();
            try
            {
                PrePareCommand(cmd, trans.Connection, trans, cmdType, cmdText, commandParameters);
                SqlDataReader sdr = cmd.ExecuteReader(CommandBehavior.Default);
                cmd.Parameters.Clear();
                return sdr;
            }
            catch
            {
                throw;
            }
        }

        /// <summary>
        /// 读取数据
        /// </summary>
        /// <param name="connectionString">数据库连接字符串</param>
        /// <param name="cmdType">数据命令类型</param>
        /// <param name="cmdText">数据命令的文本</param>
        /// <param name="cmd">需要被执行的数据命令</param>
        /// <param name="commandParameters">数据命令的参数</param>
        /// <returns>返回影响的结果集行数</returns>
        public static SqlDataReader ExecuteReader(string connectiongStr, CommandType cmdType, string cmdText, out SqlCommand cmd, params SqlParameter[] commandParameters)
        {
            cmd = new SqlCommand();
            SqlConnection conn = new SqlConnection(connectiongStr);
            try
            {
                PrePareCommand(cmd, conn, null, cmdType, cmdText, commandParameters);
                SqlDataReader sdr = cmd.ExecuteReader(CommandBehavior.CloseConnection);
                cmd.Parameters.Clear();
                return sdr;
            }
            catch
            {
                throw;
            }
        }

        /// <summary>
        /// 匹配参数
        /// </summary>
        /// <param name="cmd">需要被执行的数据命令</param>
        /// <param name="conn">数据库连接</param>
        /// <param name="trans">事务</param>
        /// <param name="cmdType">数据命令类型</param>
        /// <param name="cmdText">数据命令的文本</param>
        /// <param name="cmdParms">数据命令的参数</param>
        private static void PrePareCommand(SqlCommand cmd, SqlConnection conn, SqlTransaction trans, CommandType cmdType, string cmdText, SqlParameter[] cmdParms)
        {
            if (conn.State != ConnectionState.Open)
            {
                conn.Open();
            }

            cmd.Connection = conn;
            cmd.CommandText = cmdText;

            if (trans != null)
            {
                cmd.Transaction = trans;
            }

            cmd.CommandType = cmdType;

            if (cmdParms != null)
            {
                foreach (SqlParameter param in cmdParms)
                {
                    cmd.Parameters.Add(param);
                }
            }
        }

    }
}

PersonDAL.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Configuration;
using System.Data.SqlClient;
using System.Data;
using System.ComponentModel;

namespace DAL
{
    public class PersonDAL
    {
        private static readonly string connStr = ConfigurationManager.ConnectionStrings["PagerTestConnectionString"].ToString();

        /// <summary>
        /// 获取总数
        /// </summary>
        /// <returns>返回一个总数</returns>
        public  int GetPersonCount()
        {
            int i = 0;
            using (SqlDataReader sdr = SQlHelper.ExecuteReader(connStr, CommandType.Text, "select * from Person", null))
            {
                while (sdr.Read())
                {
                    i++;
                }
                sdr.Close();
                return i;
            }
        }

        /// <summary>
        /// 分页数据列表
        /// </summary>
        /// <param name="strGetFields">需要返回的列 </param>
        /// <param name="fldName">排序的字段名</param>
        /// <param name="PageSize">页尺寸</param>
        /// <param name="PageIndex">页码</param>
        /// <param name="doCount">返回记录总数, 非 0 值则返回</param>
        /// <param name="OrderType">设置排序类型, 非 0 值则降序</param>
        /// <param name="strWhere">查询条件 (注意: 不要加 where)</param>
        /// <returns></returns>
        public BindingList<Model.Person> Getlist(string strGetFields, string fldName, int PageSize, int PageIndex, int doCount, int OrderType, string strWhere)
        {
            SqlParameter[] parameters = {
                    new SqlParameter("@tblName", SqlDbType.VarChar, 500),
                    new SqlParameter("@strGetFields", SqlDbType.VarChar, 1000),
                    new SqlParameter("@fldName", SqlDbType.VarChar, 255),
                    new SqlParameter("@PageSize", SqlDbType.Int),
                    new SqlParameter("@PageIndex", SqlDbType.Int),
                    new SqlParameter("@doCount", SqlDbType.Bit),
                    new SqlParameter("@OrderType", SqlDbType.Bit),
                    new SqlParameter("@strWhere", SqlDbType.VarChar,1500),
                    };
            parameters[0].Value = "dbo.Person";
            parameters[1].Value = strGetFields;
            parameters[2].Value = fldName;
            parameters[3].Value = PageSize;
            parameters[4].Value = PageIndex;
            parameters[5].Value = doCount;
            parameters[6].Value = OrderType;
            parameters[7].Value = strWhere;
          SqlDataReader sdr=   SQlHelper.ExecuteReader(connStr, CommandType.StoredProcedure, "dbo.sp_Common_GetListByPage", parameters);

          BindingList<Model.Person> list = new BindingList<Model.Person>();
          while (sdr.Read())
          {
              list.Add(createRpCcInfoByReader(sdr));
          }

          return list;
        }

        /// <summary>
        /// 根据reader生成Person实体
        /// </summary>
        /// <param name="reader"></param>
        /// <returns></returns>
        private Model.Person createRpCcInfoByReader(SqlDataReader reader)
        {
            Model.Person p = new Model.Person();
            p.Id = Convert.ToInt32(reader["Id"]); ;
            p.Name = Convert.ToString(reader["Name"]);
            return p;
        }
    }
}

4、BLL代码

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Data.SqlClient;
using System.ComponentModel;

namespace BLL
{
    public class PersonBLL
    {
         /// <summary>
        /// 获取总数
        /// </summary>
        /// <returns>返回一个总数</returns>
        public  int GetPersonCount()
        {
            DAL.PersonDAL p = new DAL.PersonDAL();
            return p.GetPersonCount();
        }

         /// <summary>
        /// 分页数据列表
        /// </summary>
        /// <param name="strGetFields">需要返回的列 </param>
        /// <param name="fldName">排序的字段名</param>
        /// <param name="PageSize">页尺寸</param>
        /// <param name="PageIndex">页码</param>
        /// <param name="doCount">返回记录总数, 非 0 值则返回</param>
        /// <param name="OrderType">设置排序类型, 非 0 值则降序</param>
        /// <param name="strWhere">查询条件 (注意: 不要加 where)</param>
        /// <returns></returns>
        public BindingList<Model.Person> Getlist(string strGetFields, string fldName, int PageSize, int PageIndex, int doCount, int OrderType, string strWhere)
        {
            DAL.PersonDAL p = new DAL.PersonDAL();
            return p.Getlist(strGetFields, fldName, PageSize, PageIndex, doCount, OrderType, strWhere);
        }
    }
}

5、PagerTest代码,

PagerHandler.ashx

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.ComponentModel;
using System.Text;

namespace PagerTest.Handler
{
    /// <summary>
    /// PagerHandler 的摘要说明
    /// </summary>
    public class PagerHandler : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";

            string str = string.Empty;

            //具体的页面数
            int pageIndex;
            int.TryParse(context.Request["pageIndex"], out pageIndex);

            //页面显示条数
            int size = Convert.ToInt32(context.Request["pageSize"]);

            if (pageIndex == 0)
            {
                pageIndex = 1;
            }

            int count;
            BindingList<Model.Person> list = new BLL.PersonBLL().Getlist(
                "*",
                "Id",
                size,
                pageIndex,
                0,
                1,
                 ""
                );

            StringBuilder sb = new StringBuilder();
            foreach (Model.Person p in list)
            {
                sb.Append("<tr><td>");
                sb.Append(p.Id.ToString());
                sb.Append("</td><td>");
                sb.Append(p.Name);
                sb.Append("</td></tr>");
            }
            str = sb.ToString();
            context.Response.Write(str);
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}

PageWeb.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="PageWeb.aspx.cs" Inherits="PagerTest.PageWeb" %>

<!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>
    <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script src="Scripts/jquery.pagination.js" type="text/javascript"></script>
    <link href="Style/pagination.css" rel="stylesheet" type="text/css" />
   <link href="Style/tablecloth.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">
        var pageIndex = 0;     //页面索引初始值
        var pageSize = 10;     //每页显示条数初始化,修改显示条数,修改这里即可

    $(function() {
        InitTable(0);    //Load事件,初始化表格数据,页面索引为0(第一页)

        //分页,PageCount是总条目数,这是必选参数,其它参数都是可选
        $("#Pagination").pagination(<%=pageCount %>, {
            callback: PageCallback,
            prev_text: ‘上一页‘,       //上一页按钮里text
            next_text: ‘下一页‘,       //下一页按钮里text
            items_per_page: pageSize,  //显示条数
            num_display_entries: 1,    //连续分页主体部分分页条目数
            current_page: pageIndex,   //当前页索引
            num_edge_entries: 2        //两侧首尾分页条目数
        });

        //翻页调用
        function PageCallback(index, jq) {
            InitTable(index);
        }

        //请求数据
        function InitTable(pageIndex) {
            $.ajax({
                type: "POST",
                dataType: "text",
                url: ‘Handler/PagerHandler.ashx‘,      //提交到一般处理程序请求数据
                data: "pageIndex=" + (pageIndex + 1) + "&pageSize=" + pageSize,          //提交两个参数:pageIndex(页面索引),pageSize(显示条数)
                success: function(data) {
                    $("#Result tr:gt(0)").remove();        //移除Id为Result的表格里的行,从第二行开始(这里根据页面布局不同页变)
                    $("#Result").append(data);             //将返回的数据追加到表格
                }
            });
        }
    });

    </script>
</head>
<body>

   <div align="center">
  <h1>Posrchev----无刷新分页</h1>
</div>
<div id="container" >
   <table id="Result" cellspacing="0" cellpadding="0">
            <tr>
                <th>编号</th>
                <th>名称</th>
            </tr>
   </table>
    <div id="Pagination"></div>
</div>
</body>
</html>

PageWeb.aspx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace PagerTest
{
    public partial class PageWeb : System.Web.UI.Page
    {
        public string pageCount = string.Empty; //总条目数

        protected void Page_Load(object sender, EventArgs e)
        {

            if (!IsPostBack)
            {
                pageCount = new BLL.PersonBLL().GetPersonCount().ToString();
            }
        }
    }
}

运行效果:

备注:本例用了jquery.pagination.js


参数名


描述


参数值


maxentries


总条目数


必选参数,整数


items_per_page


每页显示的条目数


可选参数,默认是10


num_display_entries


连续分页主体部分显示的分页条目数


可选参数,默认是10


current_page


当前选中的页面


可选参数,默认是0,表示第1页


num_edge_entries


两侧显示的首尾分页的条目数


可选参数,默认是0


link_to


分页的链接


字符串,可选参数,默认是"#"


prev_text


“前一页”分页按钮上显示的文字


字符串参数,可选,默认是"Prev"


next_text


“下一页”分页按钮上显示的文字


字符串参数,可选,默认是"Next"


ellipse_text


省略的页数用什么文字表示


可选字符串参数,默认是"…"


prev_show_always


是否显示“前一页”分页按钮


布尔型,可选参数,默认为true,即显示“前一页”按钮


next_show_always


是否显示“下一页”分页按钮


布尔型,可选参数,默认为true,即显示“下一页”按钮


callback


回调函数


当点击链接的时候此函数被调用,此函数接受两个参数,新一页的id和pagination容器(一个DOM元素)。如果回调函数返回false,则pagination事件停止执行

Css 代码:

pagination.css

.pagination
{
    width:300px;
    margin:20px 0 20px 210px;
}

.pagination a
{
    text-decoration:none;
    border: solid 1px #AAE;
    color: #15B;
}

.pagination a, .pagination span
{
    display: block;
    float: left;
    padding: 0.3em 0.5em;
    margin-right: 5px;
    margin-bottom: 5px;
    min-width: 1em;
    text-align: center;
}

.pagination .current
{
    background: #328aa4;
    color: #fff;
    border: solid 1px #AAE;
}

.pagination .current.prev
{
    color: #999;width:40px;
    display:block;
    border-color: #999;
    background: #fff;
}

.pagination .current.next
{
    color: #999;width:40px;
    display:block;
    border-color: #999;
    background: #fff;
}

tablecloth.css

body{
    margin:0;
    padding:0;
    background:#f1f1f1;
    font:70% Arial, Helvetica, sans-serif;
    color:#555;
    line-height:150%;
    text-align:left;
}

h1{
    font-size:140%;
    margin:0 20px;
    line-height:80px;
    color:White;
    background-color:#328aa4;
}

#container{
    margin:0 auto;
    width:680px;
    background:#fff;
    padding-bottom:50px;
}
table, td{
    font:100% Arial, Helvetica, sans-serif;
}
table{width:100%;border-collapse:collapse;margin:1em 0;}
th, td{text-align:left;padding:.5em;border:1px solid #fff;}
th{background:#328aa4 url(tr_back.gif) repeat-x;color:#fff;}
td{background:#e5f1f4;}

/* tablecloth styles */

tr.even td{background:#e5f1f4;}
tr.odd td{background:#f8fbfc;}

th.over, tr.even th.over, tr.odd th.over{background:#4a98af;}
th.down, tr.even th.down, tr.odd th.down{background:#bce774;}
th.selected, tr.even th.selected, tr.odd th.selected{}

td.over, tr.even td.over, tr.odd td.over{background:#ecfbd4;}
td.down, tr.even td.down, tr.odd td.down{background:#bce774;color:#fff;}
td.selected, tr.even td.selected, tr.odd td.selected{background:#bce774;color:#555;}

/* use this if you want to apply different styleing to empty table cells*/
td.empty, tr.odd td.empty, tr.even td.empty{background:#fff;}

时间: 2025-01-19 09:53:39

Ajax+Asp.Net无刷新分页的相关文章

jQuery+AJAX+Struts实现无刷新分页

jQuery+AJAX+Struts实现无刷新分页 说明: 1.需要jQuery插件js文件: 2.使用myeclipse添加struts能力: 从前从客户端页面向服务器发送Ajax请求,需要在js中先创建XMLHttpRequest对象,对象创建好以后使用OPEN('GET/POST',URL,同步/异步)设置提交方式,URL地址,使用同步还是异步方式.然后使用send(data)向服务器发送数据,同时使用onreadystatechange来绑定回调函数.如果是使用GET方式提交数据,那么就

Bootstrap Paginator分页插件+ajax 实现动态无刷新分页

之前做分页想过做淘宝的那个,但是因为是后台要求不高,就Bootstrap Paginator插件感觉还蛮容易上手,所以就选了它. Bootstrap Paginator分页插件下载地址: DownloadVisit Project in GitHub 1.这是需要分页的页面放的 js函数: [javascript] view plaincopy <span style="font-size:14px;">function paging(page){ $.ajax({ typ

jquery+ajax(用ajax.dll)实现无刷新分页

利用ajax.dll那种方式的无刷新,在这就不说了,新朋友可以看下我的另一片文件http://www.cnblogs.com/dachuang/p/3654632.html 首先,这里用的是jquery自带的分页方法,所以要引用下面3个js文件 <script type="text/javascript" src="Scripts/jquery-1.8.2.min.js"></script> <script type="tex

asp.net中利用Jquery+Ajax+Json实现无刷新分页(二)

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="PageTest.aspx.cs" Inherits="renmai_PageTest" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xh

Asp +Js 无刷新分页

Default.aspx代码 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication1._Default" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo

ajax实现的无刷新分页代码实例

一.html代码部分: <table class="table style-5">   <thead id="t_head">     <tr>      <th>序号</th>      <th>标题</th>      <th>地点</th>      <th>已报名</th>      <th>类别</th>

Ajax实现无刷新分页

注:本文中使用到的一些类库在前面文章都能找到源代码,我会在文中指明链接所在,为了缩短文章篇幅,由此带来的阅读不便,敬请谅解. 本文讲解 Ajax 实现无刷新分页.实现原理.代码展示.代码下载. 这里需要说明一些知识: 1.Ajax 无刷新页面的好处:提供良好的客户体验,通过 Ajax 在后台从数据库中取得数据并展示,取缔了等待加载页面而出现的空白状态: 2.那么,Ajax 无刷新页面是运行在动态页面(.PHP)?还是静态页面(.html/.htm/.shtml)?答案是:静态页面: 3.实现原理

asp.net练习②——Paginaton无刷新分页

aspx代码: <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>无刷新分页</title> <link href="c

Ajax 实现无刷新分页

Ajax 实现无刷新分页