SpringDataJPA小练习

制作一个表格，通过点击其中一项进入另一个表格

显示效果

20180920190352.png

20180920190401.png

主要代码

controller类

@Controller
@RequestMapping(value = "/star")
public class StarController {
    private static final String STAR_DETAIL_PATH_NAME = "starDetail";
    private static final String STAR_LIST_PATH_NAME="starList";
    @Resource
    StarService starService;

    @GetMapping(value = "/all")
    public  String getStarList(ModelMap map){
        map.addAttribute("starList",starService.findAll());
        return STAR_LIST_PATH_NAME;
    }

    @GetMapping(value = "/{id}")
     public String getStar(@PathVariable Integer id,ModelMap map){
        map.addAttribute("star",starService.findById(id));
        return STAR_DETAIL_PATH_NAME;
       //change
    }

前端代码

<html xmlns:th="http://www.thymeleaf.org">
<html lang="zh-CN">
<head>
   <script type="text/javascript" th:src="@{https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js}"></script>
   <link th:href="@{https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css}" rel="stylesheet"/>
   <style>
       .pic{
           height: 200px;
           width:150px;
       }
   </style>
   <meta charset="UTF-8"/>
   <title>dj展示表</title>
</head>
<body>
<div class="container">
   <h3>Spring Data JPA练习 </h3>
   <legend>
       <strong>dj表</strong>
   </legend>
   <div class="col-md-4">
       <p th:text="${star.id}"></p>
       <img src="">
       <p th:text="${star.starInfo}"></p>
       <img th:src="@{${star.starImage}}" class="pic" >
       <p th:text="${star.starName}"></p>
       <p th:text="${star.starSex}"></p>
       <p th:text="${star.starWorks}"></p>
   </div>
</div>
</body>
</html>

<html lang="zh-CN">
<head>
    <script type="text/javascript" th:src="@{https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js}"></script>
    <link th:href="@{https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css}" rel="stylesheet"/>
    <meta charset="UTF-8"/>
    <title>dj列表</title>
<body>
<div class="container">
    <h3>Spring Data JPA练习 </h3>
    <table class="table table-hover table-condensed">
        <legend>
            <strong>dj表</strong>
        </legend>
        <thead>
        <tr>
            <th>编号</th>
            <th>简介</th>
            <th>名字</th>
            <th>性别</th>
            <th>作品</th>
        </tr>
        </thead>
        <tbody>
        <tr th:each="star : ${starList}">
            <th scope="row" th:text="${star.id}"></th>
            <td th:text="${star.starInfo}"></td>
            <td><a th:href="@{/star/{starId}(starId=${star.id})}" th:text="${star.starName}"></a></td>
            <td th:text="${star.starSex}"></td>
            <td th:text="${star.starWorks}"></td>

        </tr>
        </tbody>
    </table>
</div>
</body>
</html>

完整代码

https://github.com/heiyeziran/JPA/tree/master/spring-data-jpa/src

SpringDataJPA小练习

制作一个表格，通过点击其中一项进入另一个表格

显示效果

主要代码

前端代码

完整代码

推荐阅读更多精彩内容