asp.net---jquery--ajax 实现滚动条滚动到底部分页显示

最新推荐文章于 2024-11-14 10:56:19 发布

weixin_30706691

最新推荐文章于 2024-11-14 10:56:19 发布

阅读量112

点赞数

文章标签： javascript json c# ViewUI

原文链接：http://www.cnblogs.com/wangxiaoyan/p/9520259.html

版权

前台：aspx页面

  1 var bgtime = $(" #date1 ").val();
  2         var overtime = $(" #date2 ").val();
  3         var gsid = "0";
  4         var typename = "";
  5         var divstyle = "";
  6         var bgpage; //定义开始页面
  7         var recordCount; //数据总条数
  8         var pageCount;   //总页数
  9         //页面加载完成执行
 10         $(document).ready(function(){
 11             //$("#date1").attr("value", getNowFormatDate());//推荐这种写法,可正常赋值
 12             $("#date2").attr("value", getNowFormatDate());
 13             bgtime = $(" #date1 ").val();
 14             overtime = $(" #date2 ").val();
 15             typename = "全部";
 16             $("#gs").html("");
 17             $("#data-content").html("");
 18             $("#leibie").html("");
 19             $("#gs").append("<div class=\"xuanze xuanze-active\" name=\"0\">全部公司<span class=\"my-icon mui-icon mui-icon-checkmarkempty\"></span></div>");
 20             $("#leibie").append("<div class=\"xuanze xuanze-active\" name=\"全部\">全部<span class=\"my-icon mui-icon mui-icon-checkmarkempty\"></span></div>");
 21             InitPage(1,10);  //这里是调用InitPage(pageIndex,pageSize)方法,pageIndex:起始页，pageSize:每页的数据条数
 22         });
 23 　　　　　//监听滚轮事件
 24         window.onscroll = function () {
 25             if (getScrollHeight() == getWindowHeight() + getDocumentTop()) {       //当滚动条到底时,这里是触发内容
 26                 //异步请求数据,局部刷新dom
 27                 if (bgpage >= parseInt(pageCount))  //开始页数大于所有数据总页数
 28                 {
 29                     alert("已经到底部了")
 30                 }
 31                 else {
 32                     alert(bgpage)  //页数
 33                     onscoll(bgpage, 10);调用onscoll(pageIndex,pageSize)
 34                 }               
 35             }
 36         };
 37         //页面加载完成添加数据的方法
 38         function InitPage(pageIndex, pageSize) {
 39             $.ajax({
 40                 url: "SlcBuyTp.ashx",
 41                 type: 'post',
 42                 //contentType: "application/json;charset=UTF-8",
 43                 data: { "gsname": gsid, "bgtime": bgtime, "overtime": overtime, "type": typename, "pageIndex": pageIndex, "pageSize": pageSize },//encodeURI(encodeURI(typename))  escape(typename)
 44                 cache: true,
 45                 success: function (d) {
 46                     //alert(d);
 47                     //console.log(new Date().getTime());
 48                     var obj = eval('(' + d + ')');  //数组
 49                     recordCount = obj.table2[0].recordcount;  //记录数据总条数
 50                     pageCount = obj.table2[0].pagecount;      //记录总页数
 51                     for (var index = 0; index < obj.gsname.length; index++) {
 52                         var item = obj.gsname[index];
 53                         $("#gs").append("<div class=\"xuanze\" name=\"" + item.gsid + "\">" + item.gsname + "<span class=\"my-icon mui-icon mui-icon-checkmarkempty\"></span></div>");
 54                     }
 55                     for (var index = 0; index < obj.type.length; index++) {  //添加类型名称
 56                         var item = obj.type[index];
 57                         $("#leibie").append("<div class=\"xuanze\" name=\"" + item.leibie + "\">" + item.leibie + "<span class=\"my-icon mui-icon mui-icon-checkmarkempty\"></span></div>");
 58                     }
 59                     if (obj.datas.length == 0) {
 60                         var kong = "<div class=\"tb-content\"><div style=\"with:100%;hight:20px;text-align:center;position: absolute;margin: 50%;\">没有数据</div></div>"
 61                         $("#data-content").empty().append(kong);
 62                     }
 63                     else {   
 64                             for(var i=0;i<obj.datas.length;i++)
 65                             {
 66                                 var item = obj.datas[i];
 67                                 divstyle = "<div class=\"tb-content\"><table class=\"tb\"><tr><td style=\"width:35%;\">单据日期：" + item.riqi + "</td><td style=\"width:65%\">订单接收方：" + item.jsgs + "</td></tr><tr><td>物料类别：" + item.typename + "</td><td>物料名称：" + item.name + "</td></tr><tr><td>规格型号：" + item.gg + "</td><td>采购备注：" + item.beizhu + "</td></tr><tr><td>计量单位：" + item.jldw + "</td><td>数量：" + item.shuliang + "</td></tr><tr><td>需求部门：" + item.xqbm + "</td><td>本币含税金额：" + item.bbje + "</td></tr><tr><td>需求人员：" + item.xqry + "</td><td>采购部门：" + item.cgbm + "</td></tr><tr><td>采购人员：" + item.cgry + "</td><td></td></tr></table></div>";
 68                                 $("#data-content").append(divstyle);  
 69                             }                                                      
 70                     };
 71                     bgpage=parseInt(pageIndex) + 1  //起始页+1
 72                 },
 73                 error: function (XMLHttpRequest, textStatus, errorThrown) {
 74                     alert("请求数据失败,XMLHttpRequest 对象:" + JSON.stringify(XMLHttpRequest) + ",  错误信息:" + textStatus + ", 捕获的错误对象:" + errorThrown);
 75                 },
 76             });
 77         }
 78         //滚动条到底部添加数据的方法
 79         function onscoll(pageIndex, pageSize) {
 80             $.ajax({
 81                 url: "SlcBuyTp.ashx",
 82                 type: 'post',
 83                 //contentType: "application/json;charset=UTF-8",
 84                 data: { "gsname": gsid, "bgtime": bgtime, "overtime": overtime, "type": typename, "pageIndex": pageIndex, "pageSize": pageSize },//encodeURI(encodeURI(typename))  escape(typename)
 85                 cache: true,
 86                 success: function (d) {
 87                     //alert(d);
 88                     //console.log(new Date().getTime());
 89                     var obj = eval('(' + d + ')');  //数组
 90                     var recordCount = obj.table2[0].recordcount;  //记录总条数
 91                     pageCount = obj.table2[0].pagecount;   //记录总页数
 92                     if (obj.datas.length == 0) {
 93                         var kong = "<div class=\"tb-content\"><div style=\"with:100%;hight:20px;text-align:center;position: absolute;margin: 50%;\">没有数据</div></div>"
 94                         $("#data-content").empty().append(kong);
 95                     }
 96                     else {
 97                         for (var i = 0; i < obj.datas.length; i++) {
 98                             var item = obj.datas[i];
 99                             divstyle = "<div class=\"tb-content\"><table class=\"tb\"><tr><td style=\"width:35%;\">单据日期：" + item.riqi + "</td><td style=\"width:65%\">订单接收方：" + item.jsgs + "</td></tr><tr><td>物料类别：" + item.typename + "</td><td>物料名称：" + item.name + "</td></tr><tr><td>规格型号：" + item.gg + "</td><td>采购备注：" + item.beizhu + "</td></tr><tr><td>计量单位：" + item.jldw + "</td><td>数量：" + item.shuliang + "</td></tr><tr><td>需求部门：" + item.xqbm + "</td><td>本币含税金额：" + item.bbje + "</td></tr><tr><td>需求人员：" + item.xqry + "</td><td>采购部门：" + item.cgbm + "</td></tr><tr><td>采购人员：" + item.cgry + "</td><td></td></tr></table></div>";
100                             $("#data-content").append(divstyle);
101                         }
102                     };                 
103                         bgpage = parseInt(pageIndex) + 1  //起始页+1
104                 },
105                 error: function (XMLHttpRequest, textStatus, errorThrown) {
106                     alert("请求数据失败,XMLHttpRequest 对象:" + JSON.stringify(XMLHttpRequest) + ",  错误信息:" + textStatus + ", 捕获的错误对象:" + errorThrown);
107                 },
108             });
109         }

后台：ashx页面

<%@ WebHandler Language="C#" Class="SlcBuyTp" %>

using System;
using System.Web;
using System.Data;
using cschef;

public class SlcBuyTp : IHttpHandler {
    protected static int RecordCount = 0;  //记录数据总行数
    public void ProcessRequest (HttpContext context) {
        context.Response.ContentType = "text/plain";
        string type;
        string datas;
        string gsbh = context.Request.Form["gsname"];//如果是get方式应该用context.Request.QueryString
        string bgtime = context.Request.Form["bgtime"];//如果是get方式应该用context.Request.QueryString
        string overtime = context.Request.Form["overtime"];//如果是get方式应该用context.Request.QueryString
        string typename = context.Request.Form["type"];//如果是get方式应该用context.Request.QueryString
        int pageIndex = CC.ToInt(context.Request.Form["pageIndex"]);  //起始页
        int pageSize =CC.ToInt(context.Request.Form["pageSize"]);//每个页面数据条数
        #region 分页配置
        if (pageIndex == 0) { pageIndex = 1; }
        #endregion
        if (gsbh == "0")
        {
            if(typename == "全部")
            {
                datas = @"select CONVERT(varchar(100), djrq, 23) riqi,wllbmc typename,ghdw jsgs,wlmc name,cpgg gg,bz beizhu,jldw jldw,sl shuliang,bbje bbje,xqbm xqbm,xqry xqry,cgbm cgbm,cgry cgry 
                        from t_cgmx where djrq between '"+bgtime+"' and '"+overtime+"'";
            }
            else
            {
                datas = @"select CONVERT(varchar(100), djrq, 23) riqi,wllbmc typename,ghdw jsgs,wlmc name,cpgg gg,bz beizhu,jldw jldw,sl shuliang,bbje bbje,xqbm xqbm,xqry xqry,cgbm cgbm,cgry cgry
                    from t_cgmx where djrq between '"+bgtime+"' and '"+overtime+"' and wllbmc='"+typename+"'";
            }
        }
        else
        {
            //gsbh!=0
            if(typename == "全部")
            {
                datas = @"select CONVERT(varchar(100), djrq, 23) riqi,wllbmc typename,ghdw jsgs,wlmc name,cpgg gg,bz beizhu,jldw jldw,sl shuliang,bbje bbje,xqbm xqbm,xqry xqry,cgbm cgbm,cgry cgry
                        from t_cgmx where djrq between '"+bgtime+"' and '"+overtime+"' and gsbh='"+gsbh+"'";
            }
            else
            {
                datas =@"select CONVERT(varchar(100), djrq, 23) riqi,wllbmc typename,ghdw jsgs,wlmc name,cpgg gg,bz beizhu,jldw jldw,sl shuliang,bbje bbje,xqbm xqbm,xqry xqry,cgbm cgbm,cgry cgry
                        from t_cgmx where djrq between '"+bgtime+"' and '"+overtime+"' and gsbh='"+gsbh+"'and wllbmc='"+typename+"'";
            }

        }
        DataTable TbDatas = new DataTable();
        TbDatas = DBHelper.DBContext.Default.GetDataTable(datas);  
        RecordCount = TbDatas.Rows.Count;    //数据总条数
        DataTable dtData = new DataTable();    //数据表
        if(RecordCount==0)    //如果没有数据
        {
            dtData = TbDatas;
        }
        else  //否则
        {
            dtData = GetPagedTable(TbDatas, pageIndex, pageSize);//调用 GetPagedTable(DataTable dt, int PageIndex, int PageSize)方法，为TbDatas进行分页
        }
        DataTable dtCount = new DataTable();  //记录TbDatas数据表的总数据条数和总页数的表
        dtCount.TableName = "table2";
        dtCount.Columns.Add("recordcount"); //给一列命名 
        dtCount.Rows.Add(RecordCount);    //添加dt的行数到dtCount
        dtCount.Columns.Add("pagecount");  //添加dt的行名，第二列
        dtCount.Rows[0]["pagecount"]=getPageCount(TbDatas.Rows.Count,pageSize);  //将总数据页数添加到pagecount列
        dtData.TableName = "datas";
        DataSet ds = new DataSet();
        ds.Tables.Add(dtData);
        ds.Tables.Add(dtCount);
        string JsonString1 = Newtonsoft.Json.JsonConvert.SerializeObject(ds);  //转换成json
        context.Response.Write(JsonString1);
    }

    /// <summary>    
    /// 对DataTable进行分页,起始页为1    
    /// </summary>    
    /// <param name="dt">查询出的数据表</param>    
    /// <param name="PageIndex">起始页</param>    
    /// <param name="PageSize">每页数据条数</param>    
    /// <returns></returns>    
    public static DataTable GetPagedTable(DataTable dt, int PageIndex, int PageSize)
    {
        if (PageIndex == 0)
            return dt;
        DataTable newdt = dt.Copy();
        newdt.Clear();
        int rowbegin = (PageIndex - 1) * PageSize;
        int rowend = PageIndex * PageSize;
        if (rowbegin >= dt.Rows.Count)
            return newdt;
        if (rowend > dt.Rows.Count)
            rowend = dt.Rows.Count;
        for (int i = rowbegin; i <= rowend - 1; i++)
        {
            DataRow newdr = newdt.NewRow();
            DataRow dr = dt.Rows[i];
            foreach (DataColumn column in dt.Columns)
            {
                newdr[column.ColumnName] = dr[column.ColumnName];
            }
            newdt.Rows.Add(newdr);
        }
        return newdt;
    }
    /// <summary>    
    /// 获取总页数    
    /// </summary>    
    /// <param name="sumCount">结果集数量</param>    
    /// <param name="pageSize">页面数量</param>    
    /// <returns></returns>    
    public static int getPageCount(int sumCount, int pageSize)
    {
        int page = sumCount / pageSize;
        if (sumCount % pageSize > 0)
        {
            page = page + 1;
        }
        return page;
    }
    public bool IsReusable {
        get {
            return false;
        }
    }

}