datatables 带查询条件java服务端分页处理实例
作者:绝影A 发布时间:2023-12-24 08:48:16
标签:java,服务端,分页
使用datatables自带后台查询
前台代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="shortcut icon" type="image/ico"
href="http://www.datatables.net/favicon.ico" rel="external nofollow" >
<meta name="viewport" content="initial-scale=1.0, maximum-scale=2.0">
<link rel="stylesheet" type="text/css"
href="../../js/DataTables-1.10.8/media/css/jquery.dataTables.css" rel="external nofollow" >
<script type="text/javascript" language="javascript"
src="../../js/DataTables-1.10.8/media/js/jquery.js"></script>
<script type="text/javascript" language="javascript"
src="../../js/DataTables-1.10.8/media/js/jquery.dataTables.js"></script>
<script type="text/javascript" language="javascript" class="init">
var table;
$(document).ready(function() {
table = $('#example').DataTable( {
"pagingType": "simple_numbers",//设置分页控件的模式
searching: false,//屏蔽datatales的查询框
aLengthMenu:[10],//设置一页展示10条记录
"bLengthChange": false,//屏蔽tables的一页展示多少条记录的下拉列表
"oLanguage": { //对表格国际化
"sLengthMenu": "每页显示 _MENU_条",
"sZeroRecords": "没有找到符合条件的数据",
// "sProcessing": "<img src='./loading.gif' />",
"sInfo": "当前第 _START_ - _END_ 条共计 _TOTAL_ 条",
"sInfoEmpty": "木有记录",
"sInfoFiltered": "(从 _MAX_ 条记录中过滤)",
"sSearch": "搜索:",
"oPaginate": {
"sFirst": "首页",
"sPrevious": "前一页",
"sNext": "后一页",
"sLast": "尾页"
}
},
"processing": true, //打开数据加载时的等待效果
"serverSide": true,//打开后台分页
"ajax": {
"url": "../../alarms/datatablesTest",
"dataSrc": "aaData",
"data": function ( d ) {
var level1 = $('#level1').val();
//添加额外的参数传给服务器
d.extra_search = level1;
}
},
"columns": [
{ "data": "total" },
{ "data": "level" }
]
} );
} );
function search1()
{
table.ajax.reload();
}
</script>
</head>
<body class="dt-example">
<div>
<input type="text" id="level1">
<input type="button" onclick="search1()" value="查询">
</div>
<table id="example" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th>Name</th>
<th>Position</th>
</tr>
</thead>
</table>
</body>
</html>
Java代码如下,使用spring的 @ResponseBody将结果转换成json格式返回给前台
@RequestMapping(value="/datatablesTest", method=RequestMethod.GET)
@ResponseBody
public DatatablesViewPage<Alarm> datatablesTest(HttpServletRequest request){
//获取分页控件的信息
String start = request.getParameter("start");
System.out.println(start);
String length = request.getParameter("length");
System.out.println(length);
//获取前台额外传递过来的查询条件
String extra_search = request.getParameter("extra_search");
System.out.println(extra_search);
//随便组织的查询结果
List<Alarm> list = new ArrayList<Alarm>();
Alarm alarm = new Alarm();
alarm.setLevel(1);
alarm.setTotal(100L);
list.add(alarm);
alarm = new Alarm();
alarm.setLevel(2);
alarm.setTotal(100L);
list.add(alarm);
DatatablesViewPage<Alarm> view = new DatatablesViewPage<Alarm>();
view.setiTotalDisplayRecords(100);
view.setiTotalRecords(100);
view.setAaData(list);
return view;
}
DatatablesViewPage的声明如下:
public class DatatablesViewPage<T> {
private List<T> aaData; //aaData 与datatales 加载的“dataSrc"对应
private int iTotalDisplayRecords;
private int iTotalRecords;
public DatatablesViewPage() {
}
//get set方法 此处省略
}
在后台传输数据也可以用fastjson ;
@ResponseBody
@RequestMapping("/datatable2")
public JSON getTable2(String aoData){
String sEcho = "";// 记录操作的次数 每次加1
String iDisplayStart = "";// 起始
String iDisplayLength = "";// size
String sSearch = "";// 搜索的关键字
int count = 1 ; //查询出来的数量
JSONArray alldata = JSON.parseArray(aoData);
for (int i = 0; i <alldata.size() ; i++) {
JSONObject obj = (JSONObject) alldata.get(i);
if (obj.get("name").equals("sEcho"))
sEcho = obj.get("value").toString();
if (obj.get("name").equals("iDisplayStart"))
iDisplayStart = obj.get("value").toString();
if (obj.get("name").equals("iDisplayLength"))
iDisplayLength = obj.get("value").toString();
if (obj.get("name").equals("sSearch"))
sSearch = obj.get("value").toString();
}
DataTableModel u1 = new DataTableModel();
u1.setFirst_name("Airi");
u1.setLast_name("Satou");
u1.setPosition("Accountant");
u1.setOffice("Tokyo");
u1.setStart_date("28th Nov 08");
u1.setSalary("$162,700");
Map<String,Object> listMap = new HashMap<String, Object>();
List<DataTableModel> list = new ArrayList<DataTableModel>();
list.add(u1);
listMap.put("iTotalRecords",count);
listMap.put("sEcho",Integer.parseInt(sEcho)+1);
listMap.put("iTotalDisplayRecords",count);
listMap.put("aaData",list);
return (JSON)JSON.toJSON(listMap);
}
来源:http://blog.csdn.net/lllliulin/article/details/51193004
0
投稿
猜你喜欢
- 一、SpringBoot整合FastJson1.1、引入FastJson依赖包maven项目:<dependency> &nbs
- 如果你想知道java annotation是什么?你可以先看看:“http://www.infoq.com/articles/Annotat
- 一、Stream流简单示例需求:按照要求集合创建和遍历创建一个结合,存储多个字符串元素把集合中所有以"张"开头的元素存储
- 一、spring定时任务执行两次问题重现和解析最近使用quartz定时任务框架,结果发现开发环境执行无任何问题,部署到服务器上后,发现同一时
- 前言《飞机大战-I》是一款融合了街机、竞技等多种元素的经典射击手游。华丽精致的游戏画面,超炫带感的技能特效,超火爆画面让你肾上腺素爆棚,给你
- 本文实例讲述了Java实现的最大匹配分词算法。分享给大家供大家参考,具体如下:全文检索有两个重要的过程:1分词2倒排索引我们先看分词算法目前
- 1.登录腾讯云点击登录选择浏览器登录。输入用户名 按回车键 然后输入 密码。2.安装java环境直接命令:yum -y install ja
- JDK提供的流继承了四大类:InputStream(字节输入流)、OutputStream(字节输出流)、Reader(字符输入流)、Wri
- 前言JDK 1.5 之前 synchronized 的性能是比较低的,但在 JDK 1.5 中,官方推出一个重量级功能 Lock,一举改变了
- 什么事读写分离读写分离,基本的原理是让主数据库处理事务性增、改、删操作(INSERT、UPDATE、DELETE),而从数据库处理SELEC
- 配置不生效的解决办法注意:如果配置不生效,则说明spring优先加载了其他配置:解决办法:添加启动参数 -Dlogging.config=c
- Spring Cloud Gateway使用Spring Cloud Gateway是一个基于Spring Boot 2.x和Spring&
- android线程消息机制主要由Handler,Looper,Message和MessageQuene四个部分组成。平常在开发中,我们常用来
- GlobalLock的作用对于某条数据进行更新操作,如果全局事务正在进行,当某个本地事务需要更新该数据时,需要使用@GlobalLock确保
- 前言:2022年Java将有什么新的特性和改进,我相信很多Java开发者都想知道。结合Java语言架构师布莱恩·格茨(
- 1.什么是mybatis逆向工程在使用mybatis时需要程序员自己编写sql语句,针对单表的sql语句量是很大的,mybatis官方提供了
- 最近过年发红包拜年成为一种新的潮流,作为程序猿对算法的好奇远远要大于对红包的好奇,这里介绍一种自己想到的一种随机红包分配策略,还请大家多多指
- 一、需求对于Java开发工程师来说,可能手头上同时负责不同的项目,但是由于历史的原因,Java版本可能没有做到统一升级,有的项目是使用JDK
- 本文实例为大家分享了Unity shader实现消融效果的具体代码,供大家参考,具体内容如下效果图:shader代码:// Upgrade
- 第一部分 问题描述1.1 具体任务本次作业任务是轨迹压缩,给定一个GPS数据记录文件,每条记录包含经度和维度两个坐标字段,所有记录的经纬度坐