アプリケーション開発

削除機能追加

初期段階いだと削除ボタンがないため追加していきます

. チェックボックスと削除ボタンを設置する

まず、タスク一覧画面(Thymeleaf テンプレート)に、タスクを削除するためのチェックボックスと削除ボタンを追加します。

HTML

<table>
  <thead>
    <tr>
      <th>選択</th>
      <th>タスク名</th>
      </tr>
  </thead>
  <tbody>
    <tr th:each="task : ${tasks}">
      <td><input type="checkbox" name="taskIds" th:value="${task.id}"></td>
      <td th:text="${task.name}"></td>
      </tr>
  </tbody>
</table>

<form id="deleteForm" th:action="@{/tasks/deleteSelected}" method="post">
  <button type="submit">選択したタスクを削除</button>
</form>

ポイント:

  • <input type="checkbox" name="taskIds" th:value="${task.id}">:各タスクの行にチェックボックスを追加します。name="taskIds" とすることで、選択されたタスクの ID がリストとしてサーバーに送信されます。
  • <form id="deleteForm" th:action="@{/tasks/deleteSelected}" method="post">:選択されたタスクを削除するためのフォームです。th:action="@{/tasks/deleteSelected}" で、Spring Boot の /tasks/deleteSelected エンドポイントに POST リクエストを送信します。

2. Controller で削除リクエストを処理する

次に、Controller に削除リクエストを処理するメソッドを追加します。

Java

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;
import java.util.List;

@Controller
public class TaskController {

    @Autowired
    private TaskService taskService;

    @PostMapping("/tasks/deleteSelected")
    public String deleteSelectedTasks(@RequestParam(name = "taskIds", required = false) List<Long> taskIds) {
        if (taskIds != null && !taskIds.isEmpty()) {
            taskService.deleteTasks(taskIds);
        }
        return "redirect:/tasks";
    }
}

ポイント:

  • @PostMapping("/tasks/deleteSelected")/tasks/deleteSelected への POST リクエストを処理します。
  • @RequestParam(name = "taskIds", required = false) List<Long> taskIds:チェックボックスで選択されたタスクの ID リストを受け取ります。required = false とすることで、タスクが選択されていない場合でもエラーになりません。
  • taskService.deleteTasks(taskIds);:Service の deleteTasks メソッドを呼び出し、タスクを削除します。
  • return "redirect:/tasks";:タスク一覧画面にリダイレクトします。

3. Service で削除処理を実装する

次に、Service に削除処理を実装します。

Java

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import java.util.List;

@Service
public class TaskService {

    @Autowired
    private TaskRepository taskRepository;

    public void deleteTasks(List<Long> taskIds) {
        taskRepository.deleteAllById(taskIds);
    }
}

ポイント:

  • taskRepository.deleteAllById(taskIds);:Repository の deleteAllById メソッドを呼び出し、タスクを一括削除します。

4. Repository でデータベース操作を実装する

最後に、Repository にデータベース操作を実装します。

Java

import org.springframework.data.jpa.repository.JpaRepository;
import org.springframework.stereotype.Repository;
import java.util.List;

@Repository
public interface TaskRepository extends JpaRepository<TaskEntity, Long> {
    void deleteAllById(Iterable<? extends Long> ids);
}

ポイント:

  • TaskRepositoryJpaRepository を継承します。
  • deleteAllById(Iterable<? extends Long> ids);JpaRepository で定義されているメソッドを使用します。

エラーが発生する場合の対処法

@RequestParamList を受け取る際にエラーが発生しました、解消するためにbuild.gradle に以下の設定を追加しまいた。

Gradle

tasks.withType(JavaCompile) {
    options.compilerArgs << "-parameters"
}

この設定により、コンパイル時にパラメータ名が保持され、@RequestParamList を正常に受け取ることができます。

まとめ

これで、Spring Boot + Thymeleaf でタスク一覧から複数タスクを削除する機能が実装できました。

-アプリケーション開発