zoukankan      html  css  js  c++  java
  • 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>
  • 相关阅读:
    Sass变量、嵌套
    遮罩层2
    遮罩层
    大图轮播
    项目资料(主页)
    关于时间控制和制定时间日期
    dom作业
    js的dom操作和函数
    js数组去重
    js For循环练习。
  • 原文地址:https://www.cnblogs.com/yabisi/p/6051053.html
Copyright © 2011-2022 走看看