初期段階いだと削除ボタンがないため追加していきます
. チェックボックスと削除ボタンを設置する
まず、タスク一覧画面(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);
}
ポイント:
TaskRepository
はJpaRepository
を継承します。deleteAllById(Iterable<? extends Long> ids);
:JpaRepository
で定義されているメソッドを使用します。
エラーが発生する場合の対処法
@RequestParam
で List
を受け取る際にエラーが発生しました、解消するためにbuild.gradle
に以下の設定を追加しまいた。
Gradle
tasks.withType(JavaCompile) {
options.compilerArgs << "-parameters"
}
この設定により、コンパイル時にパラメータ名が保持され、@RequestParam
で List
を正常に受け取ることができます。
まとめ
これで、Spring Boot + Thymeleaf でタスク一覧から複数タスクを削除する機能が実装できました。