前台:aspx页面

 var bgtime = $(" #date1 ").val();
var overtime = $(" #date2 ").val();
var gsid = "";
var typename = "";
var divstyle = "";
var bgpage; //定义开始页面
var recordCount; //数据总条数
var pageCount; //总页数
//页面加载完成执行
$(document).ready(function(){
//$("#date1").attr("value", getNowFormatDate());//推荐这种写法,可正常赋值
$("#date2").attr("value", getNowFormatDate());
bgtime = $(" #date1 ").val();
overtime = $(" #date2 ").val();
typename = "全部";
$("#gs").html("");
$("#data-content").html("");
$("#leibie").html("");
$("#gs").append("<div class=\"xuanze xuanze-active\" name=\"0\">全部公司<span class=\"my-icon mui-icon mui-icon-checkmarkempty\"></span></div>");
$("#leibie").append("<div class=\"xuanze xuanze-active\" name=\"全部\">全部<span class=\"my-icon mui-icon mui-icon-checkmarkempty\"></span></div>");
InitPage(,); //这里是调用InitPage(pageIndex,pageSize)方法,pageIndex:起始页,pageSize:每页的数据条数
});
     //监听滚轮事件
window.onscroll = function () {
if (getScrollHeight() == getWindowHeight() + getDocumentTop()) { //当滚动条到底时,这里是触发内容
//异步请求数据,局部刷新dom
if (bgpage >= parseInt(pageCount)) //开始页数大于所有数据总页数
{
alert("已经到底部了")
}
else {
alert(bgpage) //页数
onscoll(bgpage, );调用onscoll(pageIndex,pageSize)
}
}
};
//页面加载完成添加数据的方法
function InitPage(pageIndex, pageSize) {
$.ajax({
url: "SlcBuyTp.ashx",
type: 'post',
//contentType: "application/json;charset=UTF-8",
data: { "gsname": gsid, "bgtime": bgtime, "overtime": overtime, "type": typename, "pageIndex": pageIndex, "pageSize": pageSize },//encodeURI(encodeURI(typename)) escape(typename)
cache: true,
success: function (d) {
//alert(d);
//console.log(new Date().getTime());
var obj = eval('(' + d + ')'); //数组
recordCount = obj.table2[].recordcount; //记录数据总条数
pageCount = obj.table2[].pagecount; //记录总页数
for (var index = ; index < obj.gsname.length; index++) {
var item = obj.gsname[index];
$("#gs").append("<div class=\"xuanze\" name=\"" + item.gsid + "\">" + item.gsname + "<span class=\"my-icon mui-icon mui-icon-checkmarkempty\"></span></div>");
}
for (var index = ; index < obj.type.length; index++) { //添加类型名称
var item = obj.type[index];
$("#leibie").append("<div class=\"xuanze\" name=\"" + item.leibie + "\">" + item.leibie + "<span class=\"my-icon mui-icon mui-icon-checkmarkempty\"></span></div>");
}
if (obj.datas.length == ) {
var kong = "<div class=\"tb-content\"><div style=\"with:100%;hight:20px;text-align:center;position: absolute;margin: 50%;\">没有数据</div></div>"
$("#data-content").empty().append(kong);
}
else {
for(var i=;i<obj.datas.length;i++)
{
var item = obj.datas[i];
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>";
$("#data-content").append(divstyle);
}
};
bgpage=parseInt(pageIndex) + //起始页+1
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert("请求数据失败,XMLHttpRequest 对象:" + JSON.stringify(XMLHttpRequest) + ", 错误信息:" + textStatus + ", 捕获的错误对象:" + errorThrown);
},
});
}
//滚动条到底部添加数据的方法
function onscoll(pageIndex, pageSize) {
$.ajax({
url: "SlcBuyTp.ashx",
type: 'post',
//contentType: "application/json;charset=UTF-8",
data: { "gsname": gsid, "bgtime": bgtime, "overtime": overtime, "type": typename, "pageIndex": pageIndex, "pageSize": pageSize },//encodeURI(encodeURI(typename)) escape(typename)
cache: true,
success: function (d) {
//alert(d);
//console.log(new Date().getTime());
var obj = eval('(' + d + ')'); //数组
var recordCount = obj.table2[].recordcount; //记录总条数
pageCount = obj.table2[].pagecount; //记录总页数
if (obj.datas.length == ) {
var kong = "<div class=\"tb-content\"><div style=\"with:100%;hight:20px;text-align:center;position: absolute;margin: 50%;\">没有数据</div></div>"
$("#data-content").empty().append(kong);
}
else {
for (var i = ; i < obj.datas.length; i++) {
var item = obj.datas[i];
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>";
$("#data-content").append(divstyle);
}
};
bgpage = parseInt(pageIndex) + //起始页+1
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert("请求数据失败,XMLHttpRequest 对象:" + JSON.stringify(XMLHttpRequest) + ", 错误信息:" + textStatus + ", 捕获的错误对象:" + errorThrown);
},
});
}

后台:ashx页面

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

using System;
using System.Web;
using System.Data;
using cschef; public class SlcBuyTp : IHttpHandler {
protected static int RecordCount = ; //记录数据总行数
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 == ) { pageIndex = ; }
#endregion
if (gsbh == "")
{
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==) //如果没有数据
{
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[]["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 == )
return dt;
DataTable newdt = dt.Copy();
newdt.Clear();
int rowbegin = (PageIndex - ) * 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 - ; 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 > )
{
page = page + ;
}
return page;
}
public bool IsReusable {
get {
return false;
}
} }

asp.net---jquery--ajax 实现滚动条滚动到底部分页显示的更多相关文章

  1. ASP.NET jquery ajax传递参数

    第一种:GET传递 前台 ajax   GET 传递 :即在请求的地址后面加上参数,URL地址长度有显示,安全性低 后台接收:Request.QueryString[“参数名字”]! 例如: func ...

  2. jQuery粘性跟随滚动条滚动的导航栏源代码下载

    jQuery粘性跟随滚动条滚动的导航栏源代码下载 作者:网页模板 大小:0.005MB 点击次数:3494 发布时间:2014-03-07 12:55 分享到:0 特效介绍 jQuery粘性跟随滚动条 ...

  3. 使用 jQuery Ajax 在页面滚动时从服务器加载数据

    简介 文本将演示怎么在滚动滚动条时从服务器端下载数据.用AJAX技术从服务器端加载数据有助于改善任何web应用的性能表现,因为在打开页面时,只有一屏的数据从服务器端加载了,需要更多的数据时,可以随着用 ...

  4. jQuery 滚动条 滚动到底部(下拉到底部) 加载数据(触发事件、处理逻辑)、分页加载数据

    1.针对浏览器整个窗口滚动 主要代码: <script type="text/javascript"> ; function GetProductListPageFun ...

  5. Asp.Net+JQuery.Ajax之$.post

    段时间有点跑偏,经过米老师和师傅的耐心指导,终于认识到自己的问题,现在回归常规路线,继续B/S的学习. 经过近半个月的熏陶,对JQuery慢慢的有了亲切感.当时我采访过一清,问他看完JQuery视频有 ...

  6. JQuery中$.ajax()方法参数详解 ASP.NET jquery ajax传递参数

    url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如put和 ...

  7. jquery如何判断滚动条滚到页面底部并执行事件

    首先理解三个dom元素,分别是:clientHeight.offsetHeight.scrollTop. clientHeight:这个元素的高度,占用整个空间的高度,所以,如果一个div有滚动条,那 ...

  8. JS + jQuery 实现元素自动滚动到底部,兼容IE、FF、Chrome

    HTML代码: <ul class="tasklog-dialog-ul" id="auto_to_bottom"> <li>删除虚拟机 ...

  9. js 滚动条滚动到底部触发事件

    一.前言 在开发项目时,常常需要展示大量数据.如果全部显示出来,数据相对少时,看不出来什么不同,如果数据很多时,一次请求全部显示,这就相当可怕了. 面对这种问题,PC里使用了分页效果,将数据分成一页页 ...

随机推荐

  1. 题解 P1019 【单词接龙】

    题目 单词具体是什么不重要,知道单词间如何转化即可 [分析] 先理清一下题意: \(n\)个单词,每个单词限用两次 上一个单词能与下一个单词接上,当且仅当上一个单词的末尾 \(k\) 个字符与下一个单 ...

  2. SpringContextHolder类

    1.通常使用SpringContextHolder类获取bean实例: 解决: 如果要在静态方法中调用某一bean的方法,那么该bean必须声明为static的,但正常情况下@Autowired无法注 ...

  3. 洛谷 P2320 [HNOI2006]鬼谷子的钱袋

    题目传送门 解题思路: 对于每一个数i,我们都可以用i/2来表示,而对于i/2我们可以用i/4表示......(以此类推) 举个例子,对于10,我们可以用5 + 5来表示,而5可以用 3 + 2表示, ...

  4. 28. docker swarm 容器编排简介

    1.采用集群架构 集群架构包含节点和角色 docker 节点中 包含 worker 和 manager 两个角色 manager 相当于 swarm 集群的 大脑  是用来管理配置节点的 (避免单点故 ...

  5. 计蒜客 密码锁(BFS)

    https://www.jisuanke.com/course/1797/121114 Description 现在一个紧急的任务是打开一个密码锁.密码由四位数字组成,每个数字从 1 到 9 进行编号 ...

  6. spring学习之spring入门

    一 spring的基础 1:什么是spring spring是由Rod Johnson组织和开发的一个分层 的Java SE/EE 一站式轻量级开源框架,它以Ioc(控制反转)和 AOP(面向切面编程 ...

  7. 【PXC】关于限流的参数,状态值说明

    一.什么是流控(FC)?如何工作? 节点接收写集并把它们按照全局顺序组织起来,节点将接收到的未应用和提交的事务保存在接收队列中,当这个接收队列达到一定的大小,将触发限流:此时节点将暂停复制,节点会先处 ...

  8. MySql索引机制

    第一部分 MySQL数据库索引的数据结构及算法理论 第二部分 MySQL索引实现机制 第三部分 MySQL中高性能使用索引的策略 数据结构及算法 MySQL官方对索引的定义为:索引(Index)是帮助 ...

  9. mysql数据库5.6.45安装后的配置(离线安装包版)

    二.windows10下的配置 (1) 环境变量配置 打开控制面板=>系统和安全=>系统=>高级系统设置,选择环境变量,在系统变量中找到path,编辑该选项. 第一行是oracle数 ...

  10. UML-词汇表

    样例: