springboot对jpa的支持:
搭建一个项目:
如果不想搭建新项目,可以导入pom依赖:
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-data-jpa</artifactId>
</dependency>
配置yml文件:
spring:
jpa:
hibernate:
ddl-auto: update
show-sql: true
为了连接数据库,必要的:
mysql需要降低版本:
<mysql.version>5.1.44</mysql.version>
顺便把druid也配置进去
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>druid-spring-boot-starter</artifactId>
<version>1.1.10</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-aspects</artifactId>
</dependency>
连接数据所需的yml配置:
spring:
datasource:
#1.JDBC
type: com.alibaba.druid.pool.DruidDataSource
driver-class-name: com.mysql.jdbc.Driver
url: jdbc:mysql://localhost:3306/demo?useUnicode=true&characterEncoding=UTF-8&useJDBCCompliantTimezoneShift=true&useLegacyDatetimeCode=false&serverTimezone=UTC
username: root
password: 123
druid:
initial-size: 5
min-idle: 5
max-active: 20
max-wait: 60000
time-between-eviction-runs-millis: 60000
min-evictable-idle-time-millis: 30000
validation-query: SELECT 1 FROM DUAL
test-while-idle: true
test-on-borrow: true
test-on-return: false
pool-prepared-statements: true
max-pool-prepared-statement-per-connection-size: 20
filter:
stat:
merge-sql: true
slow-sql-millis: 5000
web-stat-filter:
enabled: true
url-pattern: /*
exclusions: "*.js,*.gif,*.jpg,*.png,*.css,*.ico,/druid/*"
session-stat-enable: true
session-stat-max-count: 100
stat-view-servlet:
enabled: true
url-pattern: /druid/*
reset-enable: true
login-username: admin
login-password: admin
allow: 127.0.0.1
自动建表相关代码
建个实体类:
package com.swx.springboot03.entity;
import lombok.Data;
import lombok.ToString;
import javax.persistence.*;
/**
* @author Songwanxi
* @site www.lentter.club
* @company
* @create 2020-01-03 14:00
*/
@Entity
@Table(name = "t_book_2020")
@ToString
@Data
public class Book {
@Id//主键
@GeneratedValue//自增长
@Column//列段
private Integer bid;
@Column(length = 20)
private String bname;
@Column
private Integer price;
}
运行启动类:
创建成功!
简单测试jpa增删改查:
新建dao层:
继承JpaRepository只有基础的增删改查
如果需要复杂值查询的话需要继承:JpaSpecificationExecutor
package com.swx.springboot03.dao;
import com.swx.springboot03.entity.Book;
import org.springframework.data.jpa.repository.JpaRepository;
/**
* @author Songwanxi
* @site www.lentter.club
* @company
* @create 2020-01-03 14:32
*/
public interface BookDao extends JpaRepository<Book,Integer>,, JpaSpecificationExecutor<Book> {
}
controller层:
package com.swx.springboot03.controller;
import com.swx.springboot03.dao.BookDao;
import com.swx.springboot03.entity.Book;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import java.util.List;
/**
* @author Songwanxi
* @site www.lentter.club
* @company
* @create 2020-01-03 14:33
*/
@RestController
public class BookController {
@Autowired
private BookDao bookDao;
@RequestMapping("/add")
public String add(Book book){
bookDao.save(book);
return "success";
}
@RequestMapping("/edit")
public String edit(Book book){
bookDao.save(book);
return "success";
}
@RequestMapping("/del")
public String del(Book book){
bookDao.delete(book);
return "success";
}
@RequestMapping("/getOne")
public Book getOne(Integer bid){
// 会出现懒加载问题:org.hibernate.LazyInitializationException: could not initialize proxy - no Session
// return jpaDao.getOne(bid);
return bookDao.findById(bid).get();
}
@RequestMapping("/getAll")
public List<Book> getAll(){
return bookDao.findAll();
}
@RequestMapping("/getCondition")
public List<Book> getCondition(Book book){
return bookDao.findAll(new Specification<Book>() {
@Override
public Predicate toPredicate(Root<Book> root, CriteriaQuery<?> criteriaQuery, CriteriaBuilder criteriaBuilder) {
Predicate predicate = criteriaBuilder.conjunction();
if(book != null){
if(null != book.getBname() && !"".equals(book.getBname())){
predicate.getExpressions().add(criteriaBuilder.like(root.get("bname"),"%"+book.getBname()+"%"));
}
}
return predicate;
}
});
}
}
测试一下:
实际案例:
环境:springboot+jpa+bootstrap
1.导入上传图片所需pom依赖
<dependency>
<groupId>commons-fileupload</groupId>
<artifactId>commons-fileupload</artifactId>
<version>1.3.1</version>
</dependency>
2.配置yml文件:
server:
port: 80
servlet:
context-path: /
spring:
datasource:
#1.JDBC
type: com.alibaba.druid.pool.DruidDataSource
driver-class-name: com.mysql.jdbc.Driver
url: jdbc:mysql://localhost:3306/demo?useUnicode=true&characterEncoding=UTF-8&useJDBCCompliantTimezoneShift=true&useLegacyDatetimeCode=false&serverTimezone=UTC
username: root
password: 123
druid:
initial-size: 5
min-idle: 5
max-active: 20
max-wait: 60000
time-between-eviction-runs-millis: 60000
min-evictable-idle-time-millis: 30000
validation-query: SELECT 1 FROM DUAL
test-while-idle: true
test-on-borrow: true
test-on-return: false
pool-prepared-statements: true
max-pool-prepared-statement-per-connection-size: 20
filter:
stat:
merge-sql: true
slow-sql-millis: 5000
web-stat-filter:
enabled: true
url-pattern: /*
exclusions: "*.js,*.gif,*.jpg,*.png,*.css,*.ico,/druid/*"
session-stat-enable: true
session-stat-max-count: 100
stat-view-servlet:
enabled: true
url-pattern: /druid/*
reset-enable: true
login-username: admin
login-password: admin
allow: 127.0.0.1
thymeleaf:
cache: false
# 解决图片上传大小限制问题,也可采取配置类
servlet:
multipart:
max-file-size: 20MB
max-request-size: 60MB
jpa:
hibernate:
ddl-auto: update
show-sql: true
3.给启动类加注解:
@EnableTransactionManagement
@SpringBootApplication
4.上传文件映射配置类MyWebAppConfigurer.java
package com.swx.springboot03.config;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurationSupport;
/**
* 资源映射路径
*/
@Configuration
public class MyWebAppConfigurer extends WebMvcConfigurationSupport {
@Override
protected void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/static/**").addResourceLocations("classpath:/static/");
registry.addResourceHandler("/uploadImages/**").addResourceLocations("file:E:/temp/");
super.addResourceHandlers(registry);
}
}
5.后台代码:
5.1 工具类 utils
StringUtils
package com.swx.springboot03.utils;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;
import java.util.Set;
public class StringUtils {
// 私有的构造方法,保护此类不能在外部实例化
private StringUtils() {
}
/**
* 如果字符串等于null或去空格后等于"",则返回true,否则返回false
*
* @param s
* @return
*/
public static boolean isBlank(String s) {
boolean b = false;
if (null == s || s.trim().equals("")) {
b = true;
}
return b;
}
/**
* 如果字符串不等于null或去空格后不等于"",则返回true,否则返回false
*
* @param s
* @return
*/
public static boolean isNotBlank(String s) {
return !isBlank(s);
}
/**
* set集合转string
* @param hasPerms
* @return
*/
public static String SetToString(Set hasPerms){
return Arrays.toString(hasPerms.toArray()).replaceAll(" ", "").replace("[", "").replace("]", "");
}
/**
* 转换成模糊查询所需参数
* @param before
* @return
*/
public static String toLikeStr(String before){
return isBlank(before) ? null : "%"+before+"%";
}
/**
* 将图片的服务器访问地址转换为真实存放地址
* @param imgpath 图片访问地址(http://localhost:8080/uploadImage/2019/01/26/20190126000000.jpg)
* @param serverDir uploadImage
* @param realDir E:/temp/
* @return
*/
public static String serverPath2realPath(String imgpath, String serverDir, String realDir) {
imgpath = imgpath.substring(imgpath.indexOf(serverDir));
return imgpath.replace(serverDir,realDir);
}
/**
* 过滤掉集合里的空格
* @param list
* @return
*/
public static List<String> filterWhite(List<String> list){
List<String> resultList=new ArrayList<String>();
for(String l:list){
if(isNotBlank(l)){
resultList.add(l);
}
}
return resultList;
}
/**
* 从html中提取纯文本
* @param strHtml
* @return
*/
public static String html2Text(String strHtml) {
String txtcontent = strHtml.replaceAll("</?[^>]+>", ""); //剔出<html>的标签
txtcontent = txtcontent.replaceAll("<a>\\s*|\t|\r|\n</a>", "");//去除字符串中的空格,回车,换行符,制表符
return txtcontent;
}
public static void main(String[] args) {
}
}
PageBean
package com.swx.springboot03.utils;
import javax.servlet.http.HttpServletRequest;
import java.util.Map;
/**
* 分页工具类
*/
public class PageBean {
private int page = 1;// 页码
private int rows = 3;// 页大小
private int total = 0;// 总记录数
private boolean pagination = true;// 是否分页
// 保存上次查询的参数
private Map<String, String[]> paramMap;
// 保存上次查询的url
private String url;
public void setRequest(HttpServletRequest request) {
String page = request.getParameter("page");
String rows = request.getParameter("offset");
String pagination = request.getParameter("pagination");
this.setPage(page);
this.setRows(rows);
this.setPagination(pagination);
this.setUrl(request.getRequestURL().toString());
this.setParamMap(request.getParameterMap());
}
public PageBean() {
super();
}
public Map<String, String[]> getParamMap() {
return paramMap;
}
public void setParamMap(Map<String, String[]> paramMap) {
this.paramMap = paramMap;
}
public String getUrl() {
return url;
}
public void setUrl(String url) {
this.url = url;
}
public int getPage() {
return page;
}
public void setPage(int page) {
this.page = page;
}
public void setPage(String page) {
if(StringUtils.isNotBlank(page)) {
this.page = Integer.parseInt(page);
}
}
public int getRows() {
return rows;
}
public void setRows(String rows) {
if(StringUtils.isNotBlank(rows)) {
this.rows = Integer.parseInt(rows);
}
}
public int getTotal() {
return total;
}
public void setTotal(int total) {
this.total = total;
}
public void setTotal(String total) {
if(StringUtils.isNotBlank(total)) {
this.total = Integer.parseInt(total);
}
}
public boolean isPagination() {
return pagination;
}
public void setPagination(boolean pagination) {
this.pagination = pagination;
}
public void setPagination(String pagination) {
if(StringUtils.isNotBlank(pagination) && "false".equals(pagination)) {
this.pagination = Boolean.parseBoolean(pagination);
}
}
/**
* 最大页
* @return
*/
public int getMaxPage() {
int max = this.total/this.rows;
if(this.total % this.rows !=0) {
max ++ ;
}
return max;
}
/**
* 下一页
* @return
*/
public int getNextPage() {
int nextPage = this.page + 1;
if(nextPage > this.getMaxPage()) {
nextPage = this.getMaxPage();
}
return nextPage;
}
/**
* 上一页
* @return
*/
public int getPreviousPage() {
int previousPage = this.page -1;
if(previousPage < 1) {
previousPage = 1;
}
return previousPage;
}
/**
* 获得起始记录的下标
*
* @return
*/
public int getStartIndex() {
return (this.page - 1) * this.rows;
}
@Override
public String toString() {
return "PageBean [page=" + page + ", rows=" + rows + ", total=" + total + ", pagination=" + pagination + "]";
}
}
PageUtil
package com.swx.springboot03.utils;
import java.util.Map;
import java.util.Set;
/**
* 基于bootstrap3生成分页代码
*/
public class PageUtil {
public static String createPageCode(PageBean pageBean) {
StringBuffer sb = new StringBuffer();
/*
* 拼接向后台提交数据的form表单
* 注意:拼接的form表单中的page参数是变化的,所以不需要保留上一次请求的值
*/
sb.append("<form id='pageBeanForm' action='"+pageBean.getUrl()+"' method='post'>");
sb.append("<input type='hidden' name='page'>");
Map<String, String[]> parameterMap = pageBean.getParamMap();
if(parameterMap != null && parameterMap.size() > 0) {
Set<Map.Entry<String, String[]>> entrySet = parameterMap.entrySet();
for (Map.Entry<String, String[]> entry : entrySet) {
if(!"page".equals(entry.getKey())) {
String[] values = entry.getValue();
for (String val : values) {
sb.append("<input type='hidden' name='"+entry.getKey()+"' value='"+val+"'>");
}
}
}
}
sb.append("</form>");
if(pageBean.getTotal()==0){
return "未查询到数据";
}else{
sb.append("<li><a href='javascript:gotoPage(1)'>首页</a></li>");
if(pageBean.getPage()>1){
sb.append("<li><a href='javascript:gotoPage("+pageBean.getPreviousPage()+")'>上一页</a></li>");
}else{
sb.append("<li class='disabled'><a href='javascript:gotoPage(1)'>上一页</a></li>");
}
for(int i=pageBean.getPage()-1;i<=pageBean.getPage()+1;i++){
if(i<1||i>pageBean.getMaxPage()){
continue;
}
if(i==pageBean.getPage()){
sb.append("<li class='active'><a href='#'>"+i+"</a></li>");
}else{
sb.append("<li><a href='javascript:gotoPage("+i+")'>"+i+"</a></li>");
}
}
if(pageBean.getPage()<pageBean.getMaxPage()){
sb.append("<li><a href='javascript:gotoPage("+pageBean.getNextPage()+")'>下一页</a></li>");
}else{
sb.append("<li class='disabled'><a href='javascript:gotoPage("+pageBean.getMaxPage()+")'>下一页</a></li>");
}
sb.append("<li><a href='javascript:gotoPage("+pageBean.getMaxPage()+")'>尾页</a></li>");
}
/*
* 给分页条添加与后台交互的js代码
*/
sb.append("<script type='text/javascript'>");
sb.append(" function gotoPage(page) {");
sb.append(" document.getElementById('pageBeanForm').page.value = page;");
sb.append(" document.getElementById('pageBeanForm').submit();");
sb.append(" }");
sb.append(" function skipPage() {");
sb.append(" var page = document.getElementById('skipPage').value;");
sb.append(" if(!page || isNaN(page) || parseInt(page)<1 || parseInt(page)>"+pageBean.getMaxPage()+"){");
sb.append(" alert('请输入1~N的数字');");
sb.append(" return;");
sb.append(" }");
sb.append(" gotoPage(page);");
sb.append(" }");
sb.append("</script>");
return sb.toString();
}
}
5.2 entity层:
package com.swx.springboot03.entity;
import lombok.Data;
import lombok.ToString;
import javax.persistence.*;
/**
* @author Songwanxi
* @site www.lentter.club
* @company
* @create 2020-01-03 14:00
*/
@Entity
@Table(name = "t_book_2020")
@ToString
@Data
public class Book {
@Id//主键
@GeneratedValue//自增长
@Column//列段
private Integer bid;
@Column(length = 20)
private String bname;
@Column
private Integer price;
@Column
private String bimg;
@Column
private String btype;
public Integer getBid() {
return bid;
}
public void setBid(Integer bid) {
this.bid = bid;
}
public String getBname() {
return bname;
}
public void setBname(String bname) {
this.bname = bname;
}
public Integer getPrice() {
return price;
}
public void setPrice(Integer price) {
this.price = price;
}
public String getBimg() {
return bimg;
}
public void setBimg(String bimg) {
this.bimg = bimg;
}
public String getBtype() {
return btype;
}
public void setBtype(String btype) {
this.btype = btype;
}
}
5.3 dao层
package com.swx.springboot03.dao;
import com.swx.springboot03.entity.Book;
import org.springframework.data.jpa.repository.JpaRepository;
import org.springframework.data.jpa.repository.JpaSpecificationExecutor;
/**
* @author Songwanxi
* @site www.lentter.club
* @company
* @create 2020-01-03 14:32
* 只要继承JpaRepository,通常所用的增删查改方法都有
* 第一个参数:操作的实体类
* 第二个参数:实体类对应数据表的主键
*
* 要使用高级查询必须继承
* org.springframework.data.jpa.repository.JpaSpecificationExecutor<T>接口
*/
public interface BookDao extends JpaRepository<Book,Integer>, JpaSpecificationExecutor<Book> {
}
5.4 service 层
package com.swx.springboot03.service;
import com.swx.springboot03.entity.Book;
import com.swx.springboot03.utils.PageBean;
import org.springframework.data.domain.Page;
/**
* @author Songwanxi
* @site www.lentter.club
* @company
* @create 2020-01-03 15:07
*/
public interface BookService {
public Book save(Book book);
public void deleteById(Integer id);
public Book findById(Integer id);
public Page<Book> listPager(Book book, PageBean pageBean);
}
5.5 impl层
package com.swx.springboot03.service.impl;
import com.swx.springboot03.dao.BookDao;
import com.swx.springboot03.entity.Book;
import com.swx.springboot03.service.BookService;
import com.swx.springboot03.utils.PageBean;
import com.swx.springboot03.utils.StringUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.data.domain.Page;
import org.springframework.data.domain.PageRequest;
import org.springframework.data.domain.Pageable;
import org.springframework.data.jpa.domain.Specification;
import org.springframework.stereotype.Service;
import javax.persistence.criteria.CriteriaBuilder;
import javax.persistence.criteria.CriteriaQuery;
import javax.persistence.criteria.Predicate;
import javax.persistence.criteria.Root;
/**
* @author Songwanxi
* @site www.lentter.club
* @company
* @create 2020-01-03 15:09
*/
@Service
public class BookServiceImpl implements BookService {
@Autowired
private BookDao bookDao;
@Override
public Book save(Book book) {
return bookDao.save(book);
}
@Override
public void deleteById(Integer id) {
bookDao.deleteById(id);
}
@Override
public Book findById(Integer id) {
return bookDao.findById(id).get();
}
@Override
public Page<Book> listPager(Book book, PageBean pageBean) {
// jpa的Pageable分页是从0页码开始 必须继承JpaSpecificationExecutor
Pageable pageable = PageRequest.of(pageBean.getPage()-1, pageBean.getRows());
return bookDao.findAll(new Specification<Book>() {
@Override
public Predicate toPredicate(Root<Book> root, CriteriaQuery<?> criteriaQuery, CriteriaBuilder criteriaBuilder) {
Predicate predicate = criteriaBuilder.conjunction();
if(book != null){
if(StringUtils.isNotBlank(book.getBname())){
predicate.getExpressions().add(criteriaBuilder.like(root.get("bname"),"%"+book.getBname()+"%"));
}
}
return predicate;
}
},pageable);
}
}
5.6 controller 层
package com.swx.springboot03.controller;
import com.swx.springboot03.entity.Book;
import com.swx.springboot03.service.BookService;
import com.swx.springboot03.utils.PageBean;
import com.swx.springboot03.utils.PageUtil;
import com.swx.springboot03.utils.StringUtils;
import org.apache.commons.io.FileUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.data.domain.Page;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.multipart.MultipartFile;
import org.springframework.web.servlet.ModelAndView;
import javax.servlet.http.HttpServletRequest;
import java.io.File;
import java.io.IOException;
/**
* @author Songwanxi
* @site www.lentter.club
* @company
* @create 2020-01-03 15:13
*/
@Controller
@RequestMapping("/book")
public class Book2Controller {
@Autowired
private BookService bookService;
@RequestMapping("/listPager")
public ModelAndView list(Book book, HttpServletRequest request){
PageBean pageBean = new PageBean();
pageBean.setRequest(request);
ModelAndView mv = new ModelAndView();
Page<Book> books = bookService.listPager(book,pageBean);
mv.addObject("books",books);
pageBean.setTotal(books.getTotalElements()+"");
mv.addObject("pageCode", PageUtil.createPageCode(pageBean)/*.replaceAll("<","<").replaceAll(">:",">")*/);
mv.setViewName("list");
return mv;
}
@RequestMapping("/toEdit")
public ModelAndView toEdit(Book book){
ModelAndView modelAndView = new ModelAndView();
modelAndView.setViewName("edit");
modelAndView.addObject("btype",new String[]{"科幻","言情"});
if(!(book.getBid() == null || "".equals(book.getBid()))) {
Book t =bookService.findById(book.getBid());
modelAndView.addObject("book", t);
}
return modelAndView;
}
@RequestMapping("/add")
public String add(Book book, MultipartFile image){
try {
String diskPath = "E://temp/"+image.getOriginalFilename();
String serverPath ="/uploadImages/"+image.getOriginalFilename();
if(StringUtils.isNotBlank(image.getOriginalFilename())){
FileUtils.copyInputStreamToFile(image.getInputStream(),new File(diskPath));
book.setBimg(serverPath);
}
bookService.save(book);
} catch (IOException e) {
e.printStackTrace();
}
return "redirect:/book/listPager";
}
@RequestMapping("/edit")
public String edit(Book Book, MultipartFile image){
String diskPath = "E://temp/"+image.getOriginalFilename();
String serverPath = "/uploadImages/"+image.getOriginalFilename();
if(StringUtils.isNotBlank(image.getOriginalFilename())){
try {
FileUtils.copyInputStreamToFile(image.getInputStream(),new File(diskPath));
Book.setBimg(serverPath);
} catch (IOException e) {
e.printStackTrace();
}
}
bookService.save(Book);
return "redirect:/book/listPager";
}
@RequestMapping("/del/{bid}")
public String del(@PathVariable(value = "bid") Integer bid){
bookService.deleteById(bid);
return "redirect:/book/listPager";
}
}
6 前端代码:
首先导入准备好的bootstrap3文件:
然后主页面 list.html
<!DOCTYPE html>
<html lang="en">
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>书籍列表</title>
<script type="text/javascript" th:src="@{/static/js/xxx.js}"></script>
<link rel="stylesheet" th:href="@{/static/js/bootstrap3/css/bootstrap.min.css}">
<link rel="stylesheet" th:href="@{/static/js/bootstrap3/css/bootstrap-theme.min.css}">
<script type="text/javascript" th:src="@{/static/js/bootstrap3/js/jquery-1.11.2.min.js}"></script>
<script type="text/javascript" th:src="@{/static/js/bootstrap3/js/bootstrap.min.js}"></script>
</head>
<body>
<form th:action="@{/book/listPager}" method="post">
书籍名称: <input type="text" name="bname" />
<input type="submit" value="提交"/>
</form>
<a th:href="@{/book/toEdit}">新增</a>
<table border="1px" width="600px">
<thead>
<tr>
<td>ID</td>
<td>封面</td>
<td>书名</td>
<td>种类</td>
<td>价格</td>
<td>操作</td>
</tr>
</thead>
<tbody>
<tr th:each="b : ${books}">
<td th:text="${b.bid}"></td>
<td><img style="width: 60px;height: 60px;" id="imgshow" th:src="${b.bimg}" th:alt="${b.bname}"/></td>
<td th:text="${b.bname}"></td>
<td th:text="${b.btype}"></td>
<td th:text="${b.price}"></td>
<td>
<a th:href="@{'/book/del/'+${b.bid}}">删除</a>
<a th:href="@{'/book/toEdit?bid='+${b.bid}}">修改</a>
</td>
</tr>
</tbody>
</table>
<nav>
<ul class="pagination pagination-sm" th:utext="${pageCode}">
</ul>
<!--<ul class="pagination pagination-sm">-->
<!--<form id='pageBeanForm' action='http://localhost:8080/springboot/teacher/listPager' method='post'><input type='hidden' name='page'></form>-->
<!--<li><a href='javascript:gotoPage(1)'>首页</a></li>-->
<!--<li class='disabled'><a href='javascript:gotoPage(1)'>上一页</a></li>-->
<!--<li class='active'><a href='#'>1</a></li>-->
<!--<li><a href='javascript:gotoPage(2)'>2</a></li>-->
<!--<li><a href='javascript:gotoPage(2)'>下一页</a></li>-->
<!--<li><a href='javascript:gotoPage(4)'>尾页</a></li>-->
<!--<script type='text/javascript'> function gotoPage(page) { document.getElementById('pageBeanForm').page.value = page; document.getElementById('pageBeanForm').submit(); } function skipPage() { var page = document.getElementById('skipPage').value; if(!page || isNaN(page) || parseInt(page)<1 || parseInt(page)>4){ alert('请输入1~N的数字'); return; } gotoPage(page); }</script>-->
<!--</ul>-->
</nav>
</body>
</html>
修改/新增页面 edit.html
<!DOCTYPE html>
<html lang="en">
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>书籍编辑界面</title>
<script type="text/javascript">
function preShow() {
}
</script>
</head>
<body>
<form th:action="@{${book.bid} ?'/book/edit' : '/book/add'}" method="post" enctype="multipart/form-data">
<input type="hidden" name="bid" th:value="${book.bid}" />
<input type="hidden" name="bimg" th:value="${book.bimg}" />
<img id="imgshow" src="" alt=""/>
<input type="file" name="image" onchange="preShow();"></br>
书籍名称: <input type="text" name="bname" th:value="${book.bname}" /></br>
书籍价格: <input type="text" name="price" th:value="${book.price}" /></br>
单选回显
<input type="radio" name="btype"
th:each ="s:${btype}"
th:value="${s}"
th:text ="${s}"
th:attr ="checked=${s == book.btype}">
<input type="submit" value="提交"/>
</form>
</body>
</html>
整个结构图:
实际效果:
新增
修改:
上传的图片: