asp.net分页asp.net无刷新分页高效率分页

项目中经常会用到分页的功能类似的项目做过无数个了，今个把自己常用的分页代码分享一下。

首先说说服务端处理的代码：

下面代码中重点是分页的sql语句的写法，其中的参数@n是当前的页码，总的来说本服务端主要向前台输出了2个值，接收了一个参数（当前页码），输出的是总的页数和当前页码下的数据。

sql = "select t.* from (select *,ROW_NUMBER() over(order by id asc) rownum from eazy_yiliaofuwu where typeid='"+id+"')t where t.rownum>=(@n-1)*10+1 and t.rownum<=@n*10";
DataTable dt = DbHelperSQL.Query(sql, new SqlParameter("@n", pagenum)).Tables[0];

namespace EazyCMS.Web.tools
{
    /// <summary>
    /// getyaopinfuwu 的摘要说明
    /// </summary>
    public class getyaopinfuwu : IHttpHandler
    {
        private string sql = string.Empty;      
     
        private int total = 0;

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            string id = context.Request["id"];
            int pagenum = Convert.ToInt32(context.Request["pagenum"]);

            sql = "select t.* from (select *,ROW_NUMBER() over(order by id asc) rownum from eazy_yiliaofuwu where typeid='"+id+"')t where t.rownum>=(@n-1)*10+1 and t.rownum<=@n*10";
            DataTable dt = DbHelperSQL.Query(sql, new SqlParameter("@n", pagenum)).Tables[0];
            //这里得到的根据条件查询得到的数据总的条数
            total = Convert.ToInt32(DbHelperSQL.GetSingle("select COUNT(*) from eazy_yiliaofuwu where typeid=" + id));
            Medicalitems medicalitems = new Medicalitems();
            medicalitems.medicalitem = new Medicalitem[dt.Rows.Count];
            medicalitems.PageCount = (int)Math.Ceiling(total / 10.0);//总的页码0.1→1 ， 0.95→1， 1.01→2，1.0→1
            for (int i = 0; i < dt.Rows.Count; i++)
            {
                medicalitems.medicalitem[i] = new Medicalitem() { MedicalCode=dt.Rows[i]["ylcode"].ToString(), MedicalContent=dt.Rows[i]["itemcontent"].ToString(), MedicalName=dt.Rows[i]["itemname"].ToString(), MedicalPrice=dt.Rows[i]["price"].ToString(), MedicalUnit=dt.Rows[i]["danwei"].ToString() };
            }
            context.Response.Write(new JavaScriptSerializer().Serialize(medicalitems));

        }
    
       
       
        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
    class Medicalitems
    {
        public Medicalitem[] medicalitem { get; set; }
        public int PageCount { get; set; }

    }
    class Medicalitem
    {
        public string MedicalCode { get; set; }
        public string MedicalName { get; set; }
        public string MedicalContent { get; set; }
        public string MedicalUnit { get; set; }
        public string MedicalPrice { get; set; }

    }
}

View Code

再来说说前端代码：

分页代码：点此下载其它分页插件：点此下载

<script type="text/javascript">
        var id;
        function getdata(v) {
            $("#pageGro").removeAttr("style"); 
            id=v;            
            ShowPage(1);
        }

        function ShowPage(pagenum){
            $.post("../../tools/getyaopinfuwu.ashx", { "id": id,"pagenum":pagenum }, function (data) {

                //根据总页数判断，如果小于5页，则显示所有页数，如果大于5页，则显示5页。根据当前点击的页数生成
    
                var pageCount = parseInt(data.PageCount);//模拟后台总页数
                //生成分页按钮
                if(pageCount>5){
                    page_icon(1,5,0);
                }else{
                    page_icon(1,pageCount,0);
                }
    
                //点击分页按钮触发
                $("#pageGro li").live("click",function(){
                    //alert(id);
                    if(pageCount > 5){
                        var pageNum = parseInt($(this).html());//获取当前页数
                        pageGroup(pageNum,pageCount);
            

                    }else{
                        $(this).addClass("on");
                        $(this).siblings("li").removeClass("on");
                        var pageNum = parseInt($(this).html());//获取当前页数
                        ShowPage2(pageNum);
                    }
                });
    
                //点击上一页触发
                $("#pageGro .pageUp").click(function(){
                    if(pageCount > 5){
                        var pageNum = parseInt($("#pageGro li.on").html());//获取当前页
                        pageUp(pageNum,pageCount);
                    }else{
                        var index = $("#pageGro ul li.on").index();//获取当前页
                        if(index > 0){
                            $("#pageGro li").removeClass("on");//清除所有选中
                            $("#pageGro ul li").eq(index-1).addClass("on");//选中上一页
                            var pageNum = parseInt($("#pageGro li.on").html());//获取当前页
                            ShowPage2(pageNum);
                        }
                    }
                });
    
                //点击下一页触发
                $("#pageGro .pageDown").click(function(){
                    if(pageCount > 5){
                        var pageNum = parseInt($("#pageGro li.on").html());//获取当前页
                        pageDown(pageNum,pageCount);
                    }else{
                        var index = $("#pageGro ul li.on").index();//获取当前页
                        if(index+1 < pageCount){
                            $("#pageGro li").removeClass("on");//清除所有选中
                            $("#pageGro ul li").eq(index+1).addClass("on");//选中上一页
                            var pageNum = parseInt($("#pageGro li.on").html());//获取当前页
                            ShowPage2(pageNum);
                        }
                    }
                });


                //页码
                var TotalPageNum=data.PageCount;
               
                $("#myui").empty();//首先清空当前容器下面的所有内容                
                var table=data.medicalitem;//这里得到一个数据对象的数组
                for (var i = 0; i < table.length; i++) {
                    var item=table[i];
                    $("<a ><li class=''> <div class='clrfix'><div class='honor_x'> <div class='time'>"+item.MedicalCode+"</div> </div> <div class='honor_n'>"+item.MedicalName+"</div><div class='honor_p'>"+item.MedicalContent+"</div> <div class='honor_n'>"+item.MedicalUnit+"</div>  <div class='honor_c'>"+item.MedicalPrice+" </div> </div></li> </a> ").appendTo("#myui");

                }
                   
                
            },"json");
        
        }



        function ShowPage2(pagenum){
            
            $.post("../../tools/getyaopinfuwu.ashx", { "id": id,"pagenum":pagenum }, function (data) {

                $("#myui").empty();
               
                var table=data.medicalitem;
                for (var i = 0; i < table.length; i++) {
                    var item=table[i];
                    $("<a ><li class=''> <div class='clrfix'><div class='honor_x'> <div class='time'>"+item.MedicalCode+"</div> </div> <div class='honor_n'>"+item.MedicalName+"</div><div class='honor_p'>"+item.MedicalContent+"</div> <div class='honor_n'>"+item.MedicalUnit+"</div>  <div class='honor_c'>"+item.MedicalPrice+" </div> </div></li> </a> ").appendTo("#myui");

                }
                   
                
            },"json");
        
        }
       
    </script>

asp.net分页asp.net无刷新分页高效率分页

推荐阅读