溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
小編給大家分享一下Spring Data Jpa+SpringMVC+Jquery.pagination.js實現分頁的方法，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！
介紹一下Spring Data框架
spring Data : Spring 的一個子項目。用于簡化數據庫訪問，支持NoSQL 和 關系數據存儲。
下面給出SpringData 項目所支持 NoSQL 存儲：
* MongoDB （文檔數據庫）
* Neo4j（圖形數據庫）
* Redis（鍵/值存儲）
* Hbase（列族數據庫）
SpringData 項目所支持的關系數據存儲技術：
* JDBC
* JPA
JPA Spring Data : 致力于減少數據訪問層 (DAO) 的開發量。開發者只要寫好持久層接口就好，然后其它的框架會幫程序員實現。
開發步驟：
本項目是采用maven的，所以可以參考一下我的maven配置：
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
<parent>
<artifactId>muses</artifactId>
<groupId>org.muses</groupId>
<version>1.0-SNAPSHOT</version>
</parent>
<modelVersion>4.0.0</modelVersion>
<artifactId>jeeplatform-admin</artifactId>
<packaging>war</packaging>
<name>jeeplatform-admin Maven Webapp</name>
<url>http://maven.apache.org</url>
<properties>
<spring.version>4.1.5.RELEASE</spring.version>
<spring-data-jpa.version>1.4.2.RELEASE</spring-data-jpa.version>
<spring-data-commons.version>1.6.2.RELEASE</spring-data-commons.version>
<hibernate.version>4.3.8.Final</hibernate.version>
<shiro.version>1.2.3</shiro.version>
<lucene.version>4.7.2</lucene.version>
<druid.version>1.0.9</druid.version>
<poi.version>3.7</poi.version>
</properties>
<dependencies>
<!-- module start -->
<dependency>
<groupId>org.muses</groupId>
<artifactId>jeeplatform-core</artifactId>
<version>${jeeplatform.core.version}</version>
</dependency>
<dependency>
<groupId>org.muses</groupId>
<artifactId>jeeplatform-common</artifactId>
<version>1.0-SNAPSHOT</version>
</dependency>
<dependency>
<groupId>org.muses</groupId>
<artifactId>jeeplatform-oss</artifactId>
<version>${jeeplatform.oss.version}</version>
</dependency>
<dependency>
<groupId>org.muses</groupId>
<artifactId>jeeplatform-upms</artifactId>
<version>1.0-SNAPSHOT</version>
</dependency>
<!-- moudle end-->
<!-- servlet start-->
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>servlet-api</artifactId>
<version>2.5</version>
<scope>provided</scope>
</dependency>
<!-- servlet end -->
<!-- jstl start-->
<dependency>
<groupId>jstl</groupId>
<artifactId>jstl</artifactId>
<version>1.2</version>
</dependency>
<dependency>
<groupId>taglibs</groupId>
<artifactId>standard</artifactId>
<version>1.1.2</version>
</dependency>
<!-- jstl end -->
<!-- log4j start-->
<dependency>
<groupId>log4j</groupId>
<artifactId>log4j</artifactId>
<version>${log4j.version}</version>
</dependency>
<!-- log4j end-->
<!-- json解析需要的jar start-->
<dependency>
<groupId>commons-beanutils</groupId>
<artifactId>commons-beanutils</artifactId>
<version>1.8.3</version>
</dependency>
<dependency>
<groupId>commons-collections</groupId>
<artifactId>commons-collections</artifactId>
<version>3.2.1</version>
</dependency>
<dependency>
<groupId>net.sf.ezmorph</groupId>
<artifactId>ezmorph</artifactId>
<version>1.0.6</version>
</dependency>
<dependency>
<groupId>commons-lang</groupId>
<artifactId>commons-lang</artifactId>
<version>2.5</version>
</dependency>
<dependency>
<groupId>commons-logging</groupId>
<artifactId>commons-logging</artifactId>
<version>1.2</version>
</dependency>
<dependency>
<groupId>net.sf.json-lib</groupId>
<artifactId>json-lib</artifactId>
<version>2.4</version>
<type>jar</type>
<classifier>jdk15</classifier>
<scope>compile</scope>
</dependency>
<!-- json解析需要的jar end -->
<!-- mysql start-->
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
<version>${mysql.version}</version>
</dependency>
<!-- mysql end-->
<!-- commons -->
<dependency>
<groupId>commons-io</groupId>
<artifactId>commons-io</artifactId>
<version>2.0.1</version>
</dependency>
<dependency>
<groupId>commons-fileupload</groupId>
<artifactId>commons-fileupload</artifactId>
<version>1.2.2</version>
</dependency>
<!-- commons -->
<!-- spring framework start-->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-core</artifactId>
<version>${spring.version}</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-beans</artifactId>
<version>${spring.version}</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-context</artifactId>
<version>${spring.version}</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-context-support</artifactId>
<version>${spring.version}</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-jdbc</artifactId>
<version>${spring.version}</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-tx</artifactId>
<version>${spring.version}</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-test</artifactId>
<version>${spring.version}</version>
<scope>test</scope>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-web</artifactId>
<version>${spring.version}</version>
</dependency>
<!-- spring framework end -->
<!-- spring aop start-->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-aop</artifactId>
<version>${spring.version}</version>
</dependency>
<dependency>
<groupId>org.aspectj</groupId>
<artifactId>aspectjweaver</artifactId>
<version>1.6.10</version>
</dependency>
<!-- spring aop end -->
<!-- springMVC start-->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-webmvc</artifactId>
<version>${spring.version}</version>
</dependency>
<!-- springMVC end -->
<!-- spring data start-->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-orm</artifactId>
<version>${spring.version}</version>
</dependency>
<dependency>
<groupId>org.springframework.data</groupId>
<artifactId>spring-data-jpa</artifactId>
<version>${spring-data-jpa.version}</version>
</dependency>
<dependency>
<groupId>org.springframework.data</groupId>
<artifactId>spring-data-commons</artifactId>
<version>${spring-data-commons.version}</version>
</dependency>
<!-- spring data end -->
<!-- hibernate jpa start-->
<dependency>
<groupId>org.hibernate.javax.persistence</groupId>
<artifactId>hibernate-jpa-2.1-api</artifactId>
<version>1.0.0.Final</version>
</dependency>
<dependency>
<groupId>org.hibernate</groupId>
<artifactId>hibernate-core</artifactId>
<version>${hibernate.version}</version>
</dependency>
<dependency>
<groupId>org.hibernate</groupId>
<artifactId>hibernate-entitymanager</artifactId>
<version>${hibernate.version}</version>
</dependency>
<!-- hibernate jpa end -->
<!-- hibernate echache start-->
<dependency>
<groupId>org.slf4j</groupId>
<artifactId>slf4j-api</artifactId>
<version>1.6.1</version>
</dependency>
<dependency>
<groupId>net.sf.ehcache</groupId>
<artifactId>ehcache-core</artifactId>
<version>2.5.0</version>
</dependency>
<dependency>
<groupId>org.hibernate</groupId>
<artifactId>hibernate-ehcache</artifactId>
<version>${hibernate.version}</version>
</dependency>
<!-- hibernate echache end -->
<!-- 阿里的連接池druid start-->
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>druid</artifactId>
<version>${druid.version}</version>
</dependency>
<!-- 阿里的連接池druid end-->
<!--shiro start-->
<dependency>
<groupId>org.apache.shiro</groupId>
<artifactId>shiro-all</artifactId>
<version>${shiro.version}</version>
</dependency>
<!-- shiro end-->
<!-- velocity start-->
<dependency>
<groupId>org.apache.velocity</groupId>
<artifactId>velocity</artifactId>
<version>1.6</version>
</dependency>
<dependency>
<groupId>org.apache.velocity</groupId>
<artifactId>velocity-tools</artifactId>
<version>2.0</version>
</dependency>
<!-- velocity end-->
<!-- lucene全文搜素引擎 start-->
<dependency>
<groupId>org.apache.lucene</groupId>
<artifactId>lucene-core</artifactId>
<version>${lucene.version}</version>
</dependency>
<dependency>
<groupId>org.apache.lucene</groupId>
<artifactId>lucene-analyzers-common</artifactId>
<version>${lucene.version}</version>
</dependency>
<dependency>
<groupId>org.apache.lucene</groupId>
<artifactId>lucene-queryparser</artifactId>
<version>${lucene.version}</version>
</dependency>
<dependency>
<groupId>org.apache.lucene</groupId>
<artifactId>lucene-memory</artifactId>
<version>${lucene.version}</version>
</dependency>
<dependency>
<groupId>org.apache.lucene</groupId>
<artifactId>lucene-highlighter</artifactId>
<version>${lucene.version}</version>
</dependency>
<!-- 注意IKAnalyzer沒有maven坐標,請自行添加到本地倉庫 -->
<dependency>
<groupId>org.wltea.analyzer</groupId>
<artifactId>IKAnalyzer</artifactId>
<version>2012FF_u1</version>
<scope>system</scope>
<systemPath>${basedir}/src/main/webapp/WEB-INF/lib/IKAnalyzer2012FF_u1.jar</systemPath>
</dependency>
<!-- lucene全文搜素引擎 end -->
<!-- log4j start-->
<dependency>
<groupId>log4j</groupId>
<artifactId>log4j</artifactId>
<version>${log4j.version}</version>
</dependency>
<!-- log4j end-->
<!-- json解析需要的jar start-->
<dependency>
<groupId>commons-beanutils</groupId>
<artifactId>commons-beanutils</artifactId>
<version>1.8.3</version>
</dependency>
<dependency>
<groupId>commons-collections</groupId>
<artifactId>commons-collections</artifactId>
<version>3.2.1</version>
</dependency>
<dependency>
<groupId>net.sf.ezmorph</groupId>
<artifactId>ezmorph</artifactId>
<version>1.0.6</version>
</dependency>
<dependency>
<groupId>commons-lang</groupId>
<artifactId>commons-lang</artifactId>
<version>2.5</version>
</dependency>
<dependency>
<groupId>commons-logging</groupId>
<artifactId>commons-logging</artifactId>
<version>1.2</version>
</dependency>
<dependency>
<groupId>net.sf.json-lib</groupId>
<artifactId>json-lib</artifactId>
<version>2.4</version>
<type>jar</type>
<classifier>jdk15</classifier>
<scope>compile</scope>
</dependency>
<!-- json解析需要的jar end -->
<!-- poi start-->
<dependency>
<groupId>org.apache.poi</groupId>
<artifactId>poi</artifactId>
<version>${poi.version}</version>
</dependency>
<!-- poi end-->
<!-- email start-->
<dependency>
<groupId>com.sun.mail</groupId>
<artifactId>javax.mail</artifactId>
<version>1.5.6</version>
</dependency>
<!-- email end-->
</dependencies>
<build>
<finalName>jeeplatform-admin</finalName>
</build>
</project>設計好數據庫，編寫一個實體類：
package org.muses.jeeplatform.model.entity;
import java.util.Date;
import java.util.Set;
import javax.persistence.CascadeType;
import javax.persistence.Column;
import javax.persistence.Entity;
import javax.persistence.FetchType;
import javax.persistence.GeneratedValue;
import javax.persistence.GenerationType;
import javax.persistence.Id;
import javax.persistence.JoinColumn;
import javax.persistence.JoinTable;
import javax.persistence.ManyToMany;
import javax.persistence.Table;
import javax.persistence.Temporal;
import javax.persistence.TemporalType;
/**
* 用戶信息的實體類
* @author Nicky
*/
@Entity
@Table(name="sys_user")
public class User {
/** 用戶Id**/
private int id;
/** 用戶名**/
private String username;
/** 用戶密碼**/
private String password;
/** 手機號**/
private int phone;
/** 性別**/
private String sex;
/** 郵件**/
private String email;
/** 備注**/
private String mark;
/** 用戶級別**/
private String rank;
/** 最后一次時間**/
private Date lastLogin;
/** 登錄ip**/
private String loginIp;
/** 圖片路徑**/
private String imageUrl;
/** 注冊時間**/
private Date regTime;
/** 賬號是否被鎖定**/
private Boolean locked = Boolean.FALSE;
private Set<Role> roles;
@GeneratedValue(strategy=GenerationType.IDENTITY)
@Id
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
@Column(unique=true,length=100,nullable=false)
public String getUsername() {
return username;
}
public void setUsername(String username) {
this.username = username;
}
@Column(length=100,nullable=false)
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
public int getPhone() {
return phone;
}
public void setPhone(int phone) {
this.phone = phone;
}
@Column(length=6)
public String getSex() {
return sex;
}
public void setSex(String sex) {
this.sex = sex;
}
@Column(length=100)
public String getEmail() {
return email;
}
public void setEmail(String email) {
this.email = email;
}
@Column(length=30)
public String getMark() {
return mark;
}
public void setMark(String mark) {
this.mark = mark;
}
@Column(length=10)
public String getRank() {
return rank;
}
public void setRank(String rank) {
this.rank = rank;
}
@Temporal(TemporalType.DATE)
public Date getLastLogin() {
return lastLogin;
}
public void setLastLogin(Date lastLogin) {
this.lastLogin = lastLogin;
}
@Column(length=100)
public String getLoginIp() {
return loginIp;
}
public void setLoginIp(String loginIp) {
this.loginIp = loginIp;
}
@Column(length=100)
public String getImageUrl() {
return imageUrl;
}
public void setImageUrl(String imageUrl) {
this.imageUrl = imageUrl;
}
@Temporal(TemporalType.DATE)
@Column(nullable=false)
public Date getRegTime() {
return regTime;
}
public void setRegTime(Date regTime) {
this.regTime = regTime;
}
public Boolean getLocked() {
return locked;
}
public void setLocked(Boolean locked) {
this.locked = locked;
}
}編寫接口實現Spring Data框架的PagingAndSortingRepository接口
package org.muses.jeeplatform.repository;
import org.muses.jeeplatform.model.entity.User;
import org.springframework.data.domain.Page;
import org.springframework.data.domain.Pageable;
import org.springframework.data.jpa.repository.JpaRepository;
import org.springframework.data.jpa.repository.Query;
import org.springframework.data.repository.PagingAndSortingRepository;
import org.springframework.data.repository.query.Param;
import java.util.Date;
public interface UserRepository extends PagingAndSortingRepository<User, Integer> {
/*User findByUsername(String username);
@Query("from User u where u.username=:username and u.password=:password")
User findByUsernameAndPassword(@Param("username") String username, @Param("password") String password);
@Query("from User u where u.id=:id")
User findById(@Param("id") int id);
@Query("from User u where date_format(u.lastLogin,'yyyy-MM-dd') between date_format((:startDate),'yyyy-MM-dd') and date_format((:endDate),'yyyy-MM-dd')")
Page<User> searchU(@Param("startDate")Date startDate,@Param("endDate")Date endDate, Pageable pageable);
*/
}業務類實現：
package org.muses.jeeplatform.service;
import java.util.*;
import org.muses.jeeplatform.model.entity.User;
import org.muses.jeeplatform.repository.UserRepository;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.data.domain.Page;
import org.springframework.data.domain.PageRequest;
import org.springframework.data.domain.Sort;
import org.springframework.data.jpa.domain.Specification;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;
import javax.persistence.criteria.CriteriaBuilder;
import javax.persistence.criteria.CriteriaQuery;
/**
* @description 用戶信息管理的業務類
* @author Nicky
* @date 2017年3月6日
*/
@Service
public class UserService {
@Autowired
UserRepository userRepository;
/**
* 構建PageRequest對象
* @param num
* @param size
* @param asc
* @param string
* @return
*/
private PageRequest buildPageRequest(int num, int size, Sort.Direction asc,
String string) {
return new PageRequest(num-1, size,null,string);
}
/**
* 獲取所有的菜單信息并分頁顯示
* @param pageNo
* 當前頁面數
* @param pageSize
* 每一頁面的頁數
* @return
*/
@Transactional
public Page<User> findAll(int pageNo, int pageSize, Sort.Direction dir, String str){
PageRequest request = buildPageRequest(pageNo, pageSize, dir, str);
Page<User> users = userRepository.findAll(request);
return users;
}
}控制類，采用SpringMVC框架，先編寫一個baseController，實現一些通用功能的封裝：
package org.muses.jeeplatform.web.controller;
import javax.servlet.http.HttpServletRequest;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.web.context.request.RequestContextHolder;
import org.springframework.web.context.request.ServletRequestAttributes;
import org.springframework.web.servlet.ModelAndView;
public class BaseController {
Logger log = null;
/**
* 獲取日志對象
* @return
*/
public Logger getInstance(){
if(log == null){
log = LoggerFactory.getLogger(BaseController.class);
}
return log;
}
/**
* 得到request對象
*/
public HttpServletRequest getRequest() {
HttpServletRequest request = ((ServletRequestAttributes)RequestContextHolder.getRequestAttributes()).getRequest();
return request;
}
/**
* 得到ModelAndView
*/
public ModelAndView getModelAndView(){
return new ModelAndView();
}
}控制類實現：
package org.muses.jeeplatform.web.controller;
import net.sf.json.JSONArray;
import net.sf.json.JSONObject;
import net.sf.json.JsonConfig;
import org.apache.commons.collections.map.HashedMap;
import org.muses.jeeplatform.core.Constants;
import org.muses.jeeplatform.core.ExcelViewWrite;
import org.muses.jeeplatform.core.JavaEmailSender;
import org.muses.jeeplatform.model.entity.User;
import org.muses.jeeplatform.service.UserService;
import org.muses.jeeplatform.utils.DateJsonValueProcessor;
import org.muses.jeeplatform.utils.DateUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.data.domain.Page;
import org.springframework.data.domain.Sort;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.servlet.ModelAndView;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.PrintWriter;
import java.util.*;
/**
* Created by Nicky on 2017/7/29.
*/
@RequestMapping("/user")
@Controller
public class UserController extends BaseController{
@Autowired
UserService userService;
/**
* 查詢所有管理員信息并分頁顯示
* @param request
* @param response
* @param model
* @return
*/
@RequestMapping(value = "/queryAll",produces = "application/json;charset=UTF-8")
@ResponseBody
public ModelAndView findAll(HttpServletRequest request, HttpServletResponse response, Model model){
//當前頁
String pageIndexStr = request.getParameter("pageIndex");
//每一頁的頁數
int pageSize = Constants.PAGE_SIZE;
ModelAndView mv = this.getModelAndView();
Page<User> userPage;
if(pageIndexStr==null||"".equals(pageIndexStr)){
pageIndexStr = "0";
}
int pageIndex = Integer.parseInt(pageIndexStr);
userPage = userService.findAll(pageIndex+1, pageSize, Sort.Direction.ASC,"id");
mv.addObject("totalCount",userPage.getTotalElements());
mv.addObject("pageIndex",pageIndex);
// JsonConfig cfg = new JsonConfig();
// cfg.setExcludes(new String[]{"handler","hibernateLazyInitializer"});
JsonConfig jcg = new JsonConfig();
jcg.registerJsonValueProcessor(Date.class,
new DateJsonValueProcessor("yyyy-mm-dd"));
JSONArray jsonArray = JSONArray.fromObject(userPage.getContent(),jcg);
//System.out.println(jsonArray.toString());
mv.addObject("users",jsonArray.toString());
mv.setViewName("admin/user/sys_user_list");
return mv;
}
} 【前端頁面實現】
頁面View實現，引用 jquery.pagination.js （分頁js），跟pagination.css（分頁樣式css）。
可以去這里下載：https://www.jb51.net/article/105013.htm
<%@ page contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<base href="<%=basePath %>" rel="external nofollow" >
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Insert title here</title>
<!-- bootstrap樣式-->
<link type="text/css" rel="stylesheet"
href="<%=basePath%>plugins/page/css/bootstrap-3.3.5.min.css" rel="external nofollow" />
<!-- jquery.pagination所需CSS -->
<link type="text/css" rel="stylesheet" href="<%=basePath%>plugins/page/css/pagination.css" rel="external nofollow" />
<script type="text/javascript" src="<%=basePath%>plugins/page/js/jquery.min.js"></script>
<!-- jquery.pagination所需JS 注意必須放在jquery.js后面 -->
<script type="text/javascript" src="<%=basePath%>plugins/page/js/jquery.pagination.js"></script>
<script type="text/javascript">
/** 分頁操作，使用jquery.pagination插件 add by nicky 20170729 start **/
//當前頁
var pageIndex = Number(${pageIndex});
//數據量
var totalCount = Number(${totalCount});
$(document).ready(function () {
//加入分頁的綁定
$("#Pagination").pagination(totalCount, {
callback : pageselectCallback,
prev_text : '< 上一頁',
next_text: '下一頁 >',
items_per_page : 6,
num_display_entries : 6,
current_page : pageIndex,
num_edge_entries : 1,
link_to: "user/queryAll?pageIndex=__id__" //分頁的js中會自動把"__id__"替換為當前的數。0
});
var html = "";
var data = ${users};
$.each(data,function(idx,obj){
var id = obj.id;
var username = obj.username;
var mark = obj.mark;
var phone = obj.phone;
var email = obj.email;
var lastLogin = obj.lastLogin;
var loginIp = obj.loginIp;
html += "<tr><td><input type='checkbox' name='id' id='id' value=" + id + " /></td>" +
"<td>"+id+"</td>"+
"<td>"+username+"</td>"+
"<td>"+mark+"</td>"+
"<td>"+phone+"</td>"+
"<td>"+email+"</td>"+
"<td>"+lastLogin+"</td>"+
"<td>"+loginIp+"</td>"+
"<td><a href='javascript:openEditDialog("+id+");' class='bounceIn'>配置角色</a>"+
"</tr>";
});
$("#content").append(html);
});
//這個事件是在翻頁時候用的
function pageselectCallback(index, jq) {
}
/** 分頁操作，使用jquery.pagination插件 add by nicky 20170729 end **/
//checkbox的全選/反選
var isCheckAll = false;
function doCheck(){
if(isCheckAll){
$("input[type='checkbox']").each(function(){
this.checked = false;
});
isCheckAll = false;
}else{
$("input[type='checkbox']").each(function(){
this.checked = true;
});
isCheckAll = true;
}
}
</script>
</head>
<body>
<br>
<div class="container-fluid">
<div class="row">
<div class="col-xs-12 col-md-12">
<div class="panel panel-default">
<div class="panel-body">
<form class="form-inline">
<input type="button" class="btn btn-default" value="發送郵件" onclick="sendEmail();" />
<input type="button" class="btn btn-default" value="發送短信" onclick="sendSms();" />
<input type="button" class="btn btn-default" value="導出Excel表" onclick="exportExcel();" />
<br><br><!--
<input type="text" class="form-control" id="keyword" placeholder="請輸入關鍵詞">
日期從<input type="text" class="form-control" placeholder="請輸入開始日期" value="${startdate }" id="startDate" name="startdate" onclick="WdatePicker({dateFmt:'yyyy-MM-dd' ,maxDate:'#F{$dp.$D(\'endDate\')}'});"/>
到<input type="text" class="form-control" placeholder="請輸入結束日期" value="${enddate }" id="endDate" name="enddate" onclick="WdatePicker({dateFmt:'yyyy-MM-dd' ,minDate:'#F{$dp.$D(\'startDate\')}'});" />
<input type="button" class="btn btn-default" value="Search" onclick="doSearch();"/>-->
</form>
<table class="table" id="mTable">
<thead>
<tr>
<th><input type="checkbox" onclick="doCheck();" /></th>
<th>序號</th>
<th>用戶名</th>
<th>描述</th>
<th>手機</th>
<th>郵箱</th>
<th>最近登錄</th>
<th>上次登錄IP</th>
<th>操作</th>
</tr>
</thead>
<tbody id="content">
</tbody>
</table>
<div id="Pagination" class="pagination"></div>
<!-- demo -->
</div>
</div>
</div>
</div>
</div>
</body>
</html>前端頁面展示：
以上是“Spring Data Jpa+SpringMVC+Jquery.pagination.js實現分頁的方法”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注億速云行業資訊頻道！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
