module.exports = {
queryMethod(){
let params = checkQueryParams.call(this);
if (!params) {
return;
}
//ajax请求,$UPost,$UConfApi是我在项目中封装好的方法,其实就是调取后台接口,$UPost是一个promise对象,所以可以用then()方法,params是传给后台的参数
return $UPost($UConfApi('H_Log_Operate'), params).then(result => { //es6箭头函数的写法
if (!result || result.rows < 1) {
return alert(“无查询结构!”);
}
let pager = $('#grid').datagrid('getPager');
pager.pagination('refresh', {
total:result.results
});
pager.pagination({
onSelectPage: function (pageNum, pageSize) {
let start = parseInt(pageNum-1)*parseInt(pageSize);
let limit = parseInt(pageSize);
//再次调用接口,取到新数据
$UPost($UConfApi('H_Log_Operate'), {start:start,limit:limit}).then(result => {
let data = result.rows;
$('#grid').datagrid('loadData',data);
pager.pagination('refresh', {
total:result.results,
pageNumber: pageNum,
pageSize: pageSize
});
}) }
});
}) },
} //获取参数
function checkQueryParams() {

    let {
LangCommon: lang,
LangUser
} = $ULanguage();
let {
starttime,
endtime,
accountid,
start = 0,
limit
} = this;
accountid = $('#accountid').textbox('getText');
starttime = $("#range-time-start").val();
endtime = $("#range-time-end").val();
let shortName = $("#shortname").combobox('getText');
if(!shortName){
return $UToolAlert(LangUser.shortname_null);
}
if (!accountid) {
return $UToolAlert(lang.exist);
}
if (!starttime || !endtime) {
return $UToolAlert(lang.dateHint)
}
//分页相关内容start
    let opts = $('#grid').datagrid('options');
let pager = $('#grid').datagrid('getPager');
    pager.pagination({
onSelectPage: function (pageNum, pageSize) {
opts.pageNumber = pageNum;
opts.pageSize = pageSize;
}
});
start = parseInt(opts.pageNumber-1)*parseInt(opts.pageSize);
limit = parseInt(opts.pageSize);
//分页相关内容end
    return {
starttime,
endtime,
accountid,
start,
limit
};
}

easyui datagrid 后台分页,前端如何处理的更多相关文章

  1. easyUI datagrid 前端真分页

    前文再续,书接上一回.easyUI datagrid 前端假分页 http://blog.csdn.net/leftfist/article/details/43164977 真分页是easyUI d ...

  2. easyUI datagrid 时间格式化

    从后台传过来的数据,其中含有日期字段,那么在前端的easyUI这里显示的话,会显得比较怪异,一大串,中间是个T,后面一大堆零,不知道是什么意思. 看来要进行格式化. 问题是,在哪里格式化? 如果在后端 ...

  3. easyui datagrid中datetime字段的显示和增删改查问题

    datagrid中datetime字段的异常显示: 使用过easyui datagrid的应该都知道,如果数据库中的字段是datetime类型,绑定在datagrid显式的时候会不正常显示,一般需要借 ...

  4. easyui datagrid标题列宽度自适应

    最近项目中使用easyui做前端界面,相信大部分使用过easyui datagrid的朋友有这么一个疑问:如果在columns中不设置width属性能不能写个方法让datagrid的头部标题和数据主体 ...

  5. jQuery EasyUI datagrid实现本地分页的方法

    http://www.codeweblog.com/jquery-easyui-datagrid%e5%ae%9e%e7%8e%b0%e6%9c%ac%e5%9c%b0%e5%88%86%e9%a1% ...

  6. [转载]再次谈谈easyui datagrid 的数据加载

    这篇文章只谈jQuery easyui datagrid 的数据加载,因为这也是大家谈论最多的内容.其实easyui datagrid加载数据只有两种方式:一种是ajax加载目标url返回的json数 ...

  7. 反射实体自动生成EasyUi DataGrid模板

    用EasyUi Datagrid展示数据的时候总是要一下这样一段代码 <table id="dt" class="easyui-datagrid"> ...

  8. 构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(7)-MVC与EasyUI DataGrid

    原文:构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(7)-MVC与EasyUI DataGrid 没有源码的同学跳到第六讲下载源码再来. 我们需要漂亮的UI, ...

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

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

随机推荐

  1. ZOJ 2477 Magic Cube(魔方)

    ZOJ 2477 Magic Cube(魔方) Time Limit: 2 Seconds      Memory Limit: 65536 KB This is a very popular gam ...

  2. 使用ODP.NET连接Oracle数据库

    项目需要和第三方进行对接,奇葩的是地方没给提供接口,却提供了一个Oracle的视图 所以有了C#访问Oracle数据库的需求 1.打开nuget,安装驱动 https://www.nuget.org/ ...

  3. 小程序使用阿里巴巴TTF字体文件以及图标

    转话地址https://transfonter.org 第一步:下载需要的字体图标 进入阿里图标官网http://iconfont.cn/搜索自己想要的图标,如这里需要一个购物车的图标,流程为: 搜索 ...

  4. python多环境下虚拟环境的搭建和使用

    由于开发环境要求,或者实际需要.经常会出现python2.7和python3.x共存下的开发环境问题.虚拟环境的搭建可以很好的隔离Projects的开发环境. 1.首先解决python2.7和pyth ...

  5. 初学者易上手的SSH-hibernate04 一对一 一对多 多对多

    这章我们就来学习下hibernate的关系关联,即一对一(one-to-one),一对多(one-to-many),多对多(many-to-many).这章也将是hibernate的最后一章了,用于初 ...

  6. Android studio 使用startService报错:IllegalStateException

    Android 8.0启动service报错:java.lang.RuntimeException和java.lang.IllegalStateException 错误信息: java.lang.Ru ...

  7. 从身份证管理系统思考企业CMDB的建设

    关注嘉为科技,获取运维新知 对大部分中大型的企业来说,CMDB建设对于整个IT服务和IT运维管理的重要性不言而喻,但是目前仍然有非常多的企业无法建设好CMDB. 我最近刚好接触了一个公安系统的朋友,他 ...

  8. 在docker中运行.netcore程序

    安装docker 获取core镜像 docker pull microsoft/dotnet 首先在https://hub.docker.com查找core官方镜像,相关参数设置https://hub ...

  9. 8.5 GOF设计模式四: 观察者模式Observer

    GOF设计模式四: 观察者模式Observer  现实中遇到的问题  当有许多不同的客户都对同一数据源感兴趣,对相同的数据有不同的处理方式,该如 何解决?5.1 定义: 观察者模式  观察者模式 ...

  10. FreeMarker与Thymeleaf

    FreeMarker 是一个模板引擎,一个基于模板生成文本输出的通用工具,使用纯 Java 编写,FreeMarker 被设计用来生成 HTML Web 页面,特别是基于 MVC 模式的应用程序,虽然 ...