使用datatables实现后台分页功能,减轻前端渲染压力
注意不同版本,参数名字及参数内容存在差异,具体可以参考https://datatables.net/upgrade/1.10-convert#Options
控制页面显示的参数:https://datatables.net/reference/option/

前端传给后端的参数列表:

后端传给前端的参数列表:

修改搜索触发方式(原来的触发方式为keyup,修改为回车触发):http://blog.csdn.net/u012088516/article/details/52423248
增加前端传给后端的参数:http://www.datatables.club/manual/daily/2016/04/21/option-ajax-data.html
前端传给后端的默认参数列表:
draw: 1
columns[0][data]: 0
columns[0][name]:
columns[0][searchable]: true
columns[0][orderable]: false
columns[0][search][value]:
columns[0][search][regex]: false
columns[1][data]: 1
columns[1][name]:
columns[1][searchable]: true
columns[1][orderable]: false
columns[1][search][value]:
columns[1][search][regex]: false
columns[2][data]: 2
columns[2][name]:
columns[2][searchable]: true
columns[2][orderable]: false
columns[2][search][value]:
columns[2][search][regex]: false
columns[3][data]: 3
columns[3][name]:
columns[3][searchable]: true
columns[3][orderable]: false
columns[3][search][value]:
columns[3][search][regex]: false
columns[4][data]: 4
columns[4][name]:
columns[4][searchable]: true
columns[4][orderable]: false
columns[4][search][value]:
columns[4][search][regex]: false
columns[5][data]: 5
columns[5][name]:
columns[5][searchable]: true
columns[5][orderable]: false
columns[5][search][value]:
columns[5][search][regex]: false
columns[6][data]: 6
columns[6][name]:
columns[6][searchable]: true
columns[6][orderable]: false
columns[6][search][value]:
columns[6][search][regex]: false
start: 0
length: 10
search[value]:
search[regex]: false
参考:
https://datatables.net/manual/server-side#Example-data
http://blog.csdn.net/u010403387/article/details/46355533
使用datatables实现后台分页功能,减轻前端渲染压力的更多相关文章
- 前端渲染利器——JsRender入门
JsRender不少前端人员应该都用过,它是一个比较强大的模板,不牵涉太多技术依赖,使用起来非常舒服.我本人在前端开发中使用React之前,都是用的它了(实际上我感觉React没有JsViewes好用 ...
- 前端渲染模板(一):Thymeleaf
一.使用 本篇文章将以SpringBoot为框架来介绍Thymeleaf的用法. 1 资源文件的约定目录结构 Maven的资源文件目录:/src/java/resources spring-boot ...
- 【大前端之前后分离01】JS前端渲染VS服务器端渲染
前言 之前看了一篇文章:@Charlie.Zheng Web系统开发构架再思考-前后端的完全分离,文中论述了为何要前后分离,站在前端的角度来看,是很有必要的:但是如何说服团队使用前端渲染方案却是一个现 ...
- Unity5 新功能解析--物理渲染与standard shader
Unity5 新功能解析--物理渲染与standard shader http://blog.csdn.net/leonwei/article/details/48395061 物理渲染是UNITY5 ...
- JsRender 前端渲染模板基础学习
JsRender前端渲染模板 使用模板,可以预先自定义一些固定格式的HTML标签,在需要显示数据时,再传入真实数据组装并展示在Web页中:避免了在JS中通过“+”等手动分割.连接字符串的复杂过程:针对 ...
- [转]谈谈前端渲染 VS 后端渲染
首先,预编译跟前后端没有关系,预编译一样可以用于后端渲染. 看看下面的测试时间,单位: ms 模板字符串: var s = '{{#datas}}{{name}} abcdefg {{type}} { ...
- Xwork概况 XWork是一个标准的Command模式实现,并且完全从web层脱离出来。Xwork提供了很多核心功能:前端拦截机(interceptor),运行时表单属性验证,类型转换,强大的表达式语言(OGNL – the Object Graph NavigationLanguage),IoC(Inversion of Control反转控制)容器等。 ----------------
Xwork概况 XWork是一个标准的Command模式实现,并且完全从web层脱离出来.Xwork提供了很多核心功能:前端拦截机(interceptor),运行时表单属性验证,类型转换,强大的表达式 ...
- element-ui table 前端渲染序号 index
1.前端渲染table 序号 2.使用element ui http://element-cn.eleme.io/#/zh-CN/component/table#zi-ding-yi-suo-yin ...
- Vue.js 2.0源码解析之前端渲染篇
一.前言 Vue.js框架是目前比较火的MVVM框架之一,简单易上手的学习曲线,友好的官方文档,配套的构建工具,让Vue.js在2016大放异彩,大有赶超React之势.前不久Vue.js 2.0正式 ...
随机推荐
- SQLite – 删除表
SQLite -删除表 SQLite DROP TABLE语句用于删除一个表定义和所有相关的数据,索引.触发器.约束和规范许可表. 你使用这个命令时必须小心,因为一旦一个表被删除然后表中所有可用的信息 ...
- 封装addClass 、 removeClass
<script> window.onload = function() { var oDiv = document.getElementById('div1'); var oDiv2 = ...
- window.onload和DOMContentLoaded的区别
一.何时触发这两个事件? 1.当 onload 事件触发时,页面上所有的DOM,样式表,脚本,图片,flash都已经加载完成了. 2.当 DOMContentLoaded 事件触发时,仅当DOM加载完 ...
- sysUpload.vue上传组件 的时候 看进度的时候 不要mock 注释掉 // if (process.env.NODE_ENV !== 'production') require('@/mock')
上传组件 的时候 看进度的时候 不要mock 注释掉 // if (process.env.NODE_ENV !== 'production') require('@/mock') <!-- * ...
- python基础一 day3 列表方法
ls=['a','b','c','d','a','b','c','d']lst=['e','f','g','h']# 增加# ls.append('a') 将元素a添加至列表ls的尾部# ls.ext ...
- XML 解析 & 特殊字符报错
在xml文件中,有一些符号是具有特殊意义的,如果直接使用会导致xml解析报错,为了避免错误,我们需要将特殊的字符使用其对应的转义实体进行操作.这些字符如下 < == < > = ...
- windows环境下Robot Framework的安装步骤
Robot Framework是由python编写的开源的用来做功能性测试的自动化测试框架.本文介绍Robot Framework在windows环境下的安装步骤. 安装python从python官网 ...
- 枚举(enum)的使用
在开发中我们经常会遇到一些特殊的字段,比如订单状态.支付状态.类型等,这些特殊字段在编码开发的时候,可以写成枚举类型.接下来还是看Demo吧! public enum AuditState { Wai ...
- qemu-img————QEMU的磁盘管理工具
qemu-img command [command options] Command: check [-f fmt] filename # 对磁盘镜像文件进 ...
- docker run redis
#拉取 Redis 镜像 C:\Users\WYJ>docker pull redis Using default tag: latest latest: Pulling from librar ...