Spring Boot

Spring Boot + JPAでデータを物理削除する

はじめに

前回の記事では「Spring Boot」と「Thymeleaf」を使用して詳細画面を作成しました。本記事では詳細画面から「削除」リンクを押下して、対象データを物理削除する方法を紹介します。

※論理削除をするのが一般的ですが、本記事では物理削除しています。

前回の記事はこちら → Spring Boot + Thymeleafで詳細画面を作成する

スポンサーリンク

[前回の記事で紹介した一覧画面]

一覧画面

[前回の記事で紹介した詳細画面]

詳細画面

 

ユーザー情報一覧画面の「詳細」リンク押下で、ユーザー詳細画面に遷移。

今回は、ユーザー詳細画面の「削除」リンクを押下したら、対象データを物理削除し、ユーザー情報一覧画面へ戻るまでの流れを紹介します。

バックエンド（サーバー）側のソースコード

コントローラークラス（UserController.java）

package com.example.demo.controller;

import java.util.List;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;

import com.example.demo.entity.User;
import com.example.demo.service.UserService;

/**
 * ユーザー情報 Controller
 */
@Controller
public class UserController {

    /**
     * ユーザー情報 Service
     */
    @Autowired
    UserService userService;

    /**
     * ユーザー情報一覧画面を表示
     * @param model Model
     * @return ユーザー情報一覧画面
     */
    @GetMapping(value = "/user/list")
    public String displayList(Model model) {
        List<User> userlist = userService.searchAll();
        model.addAttribute("userlist", userlist);
        return "user/list";
    }


    /**
     * ユーザー情報詳細画面を表示
     * @param id 表示するユーザーID
     * @param model Model
     * @return ユーザー情報詳細画面
     */
    @GetMapping("/user/{id}")
    public String displayView(@PathVariable Long id, Model model) {
        User user = userService.findById(id);
        model.addAttribute("userRequest", user);
        return "user/view";
    }


    /**
     * ユーザー情報削除
     * @param id 表示するユーザーID
     * @param model Model
     * @return ユーザー情報詳細画面
     */
    @GetMapping("/user/{id}/delete")
    public String delete(@PathVariable Long id, Model model) {

        // ユーザー情報の削除
        userService.delete(id);
        return "redirect:/user/list";
    }
}

ユーザー情報の削除は「delete」メソッドで実装しています。サービスクラスを呼び出し、物理削除後、ユーザー情報一覧画面へリダイレクトしています。

ユーザー情報一覧画面へリダイレクトすると「displayList」メソッドが呼ばれます。「displayList」メソッドでは、一覧に表示する最新データを取得しています。

サービスクラス（UserService.java）

package com.example.demo.service;

import java.util.List;

import javax.transaction.Transactional;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import com.example.demo.entity.User;
import com.example.demo.repository.UserMapper;
import com.example.demo.repository.UserRepository;

/**
 * ユーザー情報 Service
 */
@Service
@Transactional(rollbackOn = Exception.class)
public class UserService {

    /**
     * ユーザー情報 Repository
     */
    @Autowired
    private UserRepository userRepository;

    /**
     * ユーザー情報 Mapper
     */
    @Autowired
    private UserMapper userMapper;

    /**
     * ユーザー情報 全検索
     * @return 検索結果
     */
    public List<User> searchAll() {
        return userRepository.findAll();
    }

    /**
     * ユーザー情報 主キー検索
     * @return 検索結果
     */
    public User findById(Long id) {
        return userRepository.findById(id).get();
    }

    /**
     * ユーザー情報 物理削除
     * @param id ユーザーID
     */
    public void delete(Long id) {
        User user = findById(id);
        userRepository.delete(user);
    }
}

JPAが提供している「findById」で対象データを抽出後、「delete」関数を使用してユーザー情報を物理削除しています。

エンティティクラス（User.java）

データベースから取得したデータを格納するエンティティクラスの内容は以下の通り。@Dataアノテーションを使用して、getter、setterの定義を省略しています。

package com.example.demo.entity;

import java.io.Serializable;
import java.util.Date;

import javax.persistence.Column;
import javax.persistence.Entity;
import javax.persistence.GeneratedValue;
import javax.persistence.GenerationType;
import javax.persistence.Id;
import javax.persistence.Table;

import lombok.Data;

/**
 * ユーザー情報 Entity
 */
@Entity
@Data
@Table(name="user")
public class User implements Serializable {

    /**
     * ID
     */
    @Id
    @Column(name="id")
    @GeneratedValue(strategy=GenerationType.IDENTITY)
    private Long id;

    /**
     * 名前
     */
    @Column(name="name")
    private String name;

    /**
     * 住所
     */
    @Column(name="address")
    private String address;

    /**
     * 電話番号
     */
    @Column(name="phone")
    private String phone;

    /**
     * 更新日時
     */
    @Column(name="update_date")
    private Date updateDate;

    /**
     * 登録日時
     */
    @Column(name="create_date")
    private Date createDate;

    /**
     * 削除日時
     */
    @Column(name="delete_date")
    private Date deleteDate;
}

リポジトリクラス（UserRepository.java）

データベースにアクセスする為のリポジトリクラスの内容は以下の通り。

package com.example.demo.repository;

import org.springframework.data.jpa.repository.JpaRepository;
import org.springframework.stereotype.Repository;

import com.example.demo.entity.User;

/**
 * ユーザー情報 Repository
 */
@Repository
public interface UserRepository extends JpaRepository<User, Long> {}

フロントエンド（クライアント）側のソースコード

スポンサーリンク

一覧画面（list.html）

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
  <head>
    <title>ユーザー情報一覧</title>
    <link href="/css/list.css" rel="stylesheet"></link>
    <meta charset="utf-8" />
  </head>
  <body>
    <h1>ユーザー情報一覧</h1>
    <div><a th:href="@{/user/add}">新規登録はこちら</a></div>
    <table>
        <thead>
            <tr>
                <th>ID</th>
                <th>名前</th>
                <th>住所</th>
                <th>電話番号</th>
                <th>更新日時</th>
                <th>登録日時</th>
                <th>削除日時</th>
                <th>&nbsp;</th>
            </tr>
        </thead>
        <tbody>
            <tr th:each="user : ${userlist}" th:object="${user}">
                <td class="center" th:text="*{id}"></td>
                <td th:text="*{name}"></td>
                <td th:text="*{address}"></td>
                <td class="center" th:text="*{phone}"></td>
                <td class="center" th:text="${#dates.format(user.updateDate, 'yyyy/MM/dd')}"></td>
                <td class="center" th:text="${#dates.format(user.createDate, 'yyyy/MM/dd')}"></td>
                <td class="center" th:text="${#dates.format(user.deleteDate, 'yyyy/MM/dd')}"></td>
                <td class="center"><a th:href="@{/user/{id}(id=*{id})}">詳細</a></td>
            </tr>
        </tbody>
    </table>
  </body>
</html>

詳細画面（view.html）

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
  <head>
    <title>ユーザー情報詳細</title>
    <link href="/css/add.css" rel="stylesheet"></link>
    <meta charset="utf-8" />
  </head>
  <body>
    <h1>ユーザー情報詳細</h1>
    <table th:object="${userRequest}">
        <tr>
            <th class="cell_title">名前</th>
            <th class="cell_required"></th>
            <td th:text="*{name}"></td>
        </tr>
        <tr>
            <th class="cell_title">住所</th>
            <th class="cell_required"></th>
            <td th:text="*{address}"></td>
        </tr>
        <tr>
            <th class="cell_title">電話番号</th>
            <th class="cell_required"></th>
            <td th:text="*{phone}"></td>
        </tr>
    </table>
    <div class="btn_area_center">
        <a th:href="@{/user/{id}/edit(id=*{id})}">編集</a>
        <a th:href="@{/user/{id}/delete(id=*{id})}">削除</a>
        <a href="/user/list">一覧に戻る</a>
    </div>
  </body>
</html>

スタイルシート

[list.css]

body {
  width: 90%;
}
table{
    width: 100%;
    border-collapse: collapse;
  font-size: 12px;
}

table th, table td {
    border: 1px solid #ddd;
    padding: 6px;
}

table th {
  background-color: #F2F2F2;
}
.center {
  text-align: center;
}

[add.css]

body {
  width: 80%;
}
table{
    width: 100%;
    border-collapse: collapse;
  font-size: 13px;
}

table th, table td {
    border: 1px solid #ddd;
    padding: 6px;
}

table th {
  background-color: #F2F2F2;
}

table input {
  width:90%;
}
.cell_title {
  border-right: 0;
}
.cell_required{
    color: red;
    font-size: 12px;
    width: 10px;
    border-left: 0;
}
.btn {
  width: 100px;
    text-align: center;
}
.btn_area_center {
  margin-top: 20px;
  text-align: center;
}

動作確認

Spring Bootプロジェクトを実行して http://localhost:8080/user/1 へアクセスします。ユーザー情報詳細画面が表示されるので、「削除」リンクを押下して、ユーザー情報一覧画面へ戻ります。そして削除したデータがユーザー情報一覧画面に表示されていなければ完了です。

※1の部分は対象データのIDです。データがない場合は「Spring Boot + Thymeleafで新規登録画面を作成する」を参考にデータを作成してください。

[ユーザー情報詳細]

詳細画面

 

↓ 「削除」リンク押下

 

[ユーザー情報一覧]

ユーザー情報一覧

＼ よろしければ記事の評価をお願いします／

© 2020 ITを分かりやすく解説