zoukankan      html  css  js  c++  java
  • 对easyui datagrid进行扩展,当滚动条拉直最下面就异步加载数据。

    以下方法是通用的,只要把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);	
    				}
    
    			});


  • 相关阅读:
    Android优化之软引用和弱引用
    Android中Service与IntentService的使用比较
    Android配置文件,所有权限
    为什么Android手机总是越用越慢?
    Android之安全机制
    JDK8-函数式接口
    JDK8-Java Streams 收集器
    JDK8- java.util.stream 库笔记
    MVVM核心实现代码(简易实现)
    JavaScript小总结
  • 原文地址:https://www.cnblogs.com/jiangu66/p/3246931.html
Copyright © 2011-2022 走看看