以下方法是通用的,只要把datagrid定义为全局的即可,其他部分的代码不用进行修改!

可以把以下代码放入到一个单独的js文件,然后再需要的页面引入即可!

	$(function(){

				try{
$(".datagrid-body").scroll(function(){
var sheight = $(this)[0].scrollHeight;
var top=$(this)[0].scrollTop;
var height=$(this).height();
//判断是否到达底部
document.title='top:'+(top+height)+' heigth:'+(sheight-20);
if((top+height)+20==sheight){
document.title=datagrid.datagrid('options').url;
//请求json
//page;// 当前页
//rows;// 每页显示记录数
//拼接表单的值
var url=datagrid.datagrid('options').url;
url+='?params=xxx';
var params='';
$("#searchForm").find('input').each(function(index){
var obj=$(this);
if(obj.prop('name')!=''&&obj.val()!=''){
params+='&'+obj.prop('name')+'='+obj.val();
}
});
//获取页码、每次默认加载10条
var num=10;
//获取行数
var row=datagrid.datagrid('getRows').length; var page=(row/num)+1; //求出下一页
//$.post();
url+=params+'&page='+page+'&rows=10'; //请求数据
$.post(url,function(data){
var json=$.parseJSON(data).rows; for(var i=0;i<json.length;i++){
//自动拼接字段和赋值 var row='';
for(var item in json[i]){
row+='"'+item+'":'+'"'+json[i][item]+'",';
}
row=row.substring(0,row.length-1);
row='{'+row+'}';
row=$.parseJSON(row);
datagrid.datagrid("appendRow",row);
}
}); }else{
document.title='滚动条没有到达底部';
}
});
}
catch(e){
alert(e);
} });

对easyui datagrid进行扩展,当滚动条拉直最下面就异步加载数据。的更多相关文章

  1. easyui datagrid 异步加载数据时滚动条有时会自动滚到最底部的问题

    在使用easyui 的datagrid异步加载数据时发现滚动条有时会自动滚到最底部.经测试发现,如果加载数据前没有选中行则不会出现这个问题.这样我们可以在重新异步加载数据前取消选中行就可以避免这个问题 ...

  2. jquery easyui easyui-treegrid 使用异步加载数据

    jquery easyui easyui-treegrid 使用异步加载数据 jquery easyui easyui-treegrid 异步请求 >>>>>>&g ...

  3. WP8_当滚动到滚动条的70%时,自动加载数据效果实现

    Touch.FrameReported += Touch_FrameReported;   void Touch_FrameReported(object sender, TouchFrameEven ...

  4. easyui datagrid plunges 扩展 插件

      项目使用 springmvc4.x  spring4.x  hibernate4.x easyui 为了便于开发,扩展了easyui 的 datagrid 功能,下面直接贴上扩展代码: /** * ...

  5. 解决easyui datagrid加载数据时,checkbox列没有根据checkbox的值来确定是否选中

    背景:   昨天帮朋友做一个easyui datagrid的小实例时,才发现easyui datagrid的checkbox列,没有根据值为true或false来选中checkbox,当时感觉太让人失 ...

  6. Easyui datagrid加载数据时默认全选的问题

    问题描述: 最近使用 Easyui datagrid 展示数据,之前一直使用很正常,今天出现了一个怪异问题 加载数据后,只要点击选中列 ck 的任意行或多行,再刷新时整个datagrid的所有数据都 ...

  7. jquery easyui使用(三)······datagrid加载数据(已解决)

    <div id="table_Data"> </div> $("#table_Data").datagrid({ toolbar: '# ...

  8. (转帖)关于easyui中的datagrid在加载数据时候报错:无法获取属性"Length"的值,对象为null或未定义

    结贴说明: 很感谢sp1234等人的热心帮忙和提醒,现在我主要说明下问题所在: 首先我在独立的js文件中,直接把测试数据loaddata进去datagrid是没有问题的.var kk = {" ...

  9. winform DataGridView控件判断滚动条是否滚动到当前已加载的数据行底部 z

    http://www.zuowenjun.cn/post/2015/05/20/162.html 判断 DataGridView控件滚动条是否滚动到当前已加载的数据行底部,其实方法很简单,就是为Dat ...

随机推荐

  1. 正则表达式JSP实例

    <%@ page language="java" import="java.util.*,cn.com.Person,cn.com.Adddress" p ...

  2. BNU10792:沙漠旅行者

    有个旅行者计划横穿沙漠,沙漠中水资源很匮乏.旅行者需要依靠补给站的支持,才能横穿整个沙漠.假设所有的补给站都在一条直线上,而且旅行者一定沿着这条直线走.起点在1号补给站,终点在第N号补给站,起点和终点 ...

  3. Eclipse Removing obsolete files from server 问题

    今天在修改server.xml调试程序时,遇到下面这个问题,clean,重启都不好使.                 Removing obsolete files from server..    ...

  4. javascript 冒泡和事件源 形成的事件委托

    冒泡:即使通过子级元素的事件来触发父级的事件,通过阻止冒泡可以防止冒泡发生. 事件源:首先这个东西是有兼容行问题的,当然解决也很简单. 两者结合使用,形成的事件委托有两个优势: 1.减少性能消耗: 2 ...

  5. 记一次lnmp环境下无法执行php文件

    lnmp环境搭建好后却无法正常执行php文件,坑爹啊!~ [错误状况] 页面直接打印出php代码内容: php文件无法执行?: 查看nginx配置文件: server { listen 80; ser ...

  6. Slony-I双机备份

    测试环境:postgresql 9.3.5,slony-I2.2.3(application stack builder提供)以下参考网上教程亲自测试总结 ---------------------- ...

  7. 贪心 CF 332 C 好题 赞

    题目链接: http://codeforces.com/problemset/problem/332/C 题目意思: 有n个命令,要通过p个,某主席要在通过的p个中选择k个接受. 每个任务有两个值ai ...

  8. oracle数据库使用plsql(64位)时出现的问题

    64位win7上装PL/SQL,经常会遇见“Could not load "……\bin\oci.dll"”这个错误,我查了一下资料,原因是PL/SQL只对32位OS进行支持,解决 ...

  9. Javascript获取某个月的天数-简单方法 .(转别人的)

    Javascript里面的new  Date("xxxx/xx/xx")这个日期的构造方法有一个妙处,当你传入的是"xxxx/xx/0"(0号)的话,得到的日期 ...

  10. 破解官方recovery的签名验证

    步骤简述1.解包recovery.img,2.反编译/sbin/recovery,用ida64plus3.在反编译出来的文本中查找:signature 4.简单的看一下指令流程,CBZ下面是faile ...