如何存储 html 表中的多个复选框值并提交

Question

我有一个格式如下的表格：

 <thead class="thead-dark">
                <tr>
                    <th>Book ID</th>
                    <th>Title</th>
                    <th>Genre</th>
                    <th>Author</th>
                    <th>Edition</th>
                    <th>Borrow Book</th>
                </tr>
            </thead>
            <tbody>
                <tr th:each="book: ${filteredBooks}">
                    <td th:text="${book.title}">Title</td>
                    <td th:text="${book.title}">Title</td>
                    <td th:text="${book.genre}">Genre</td>
                    <td th:text="${book.author}">Author</td>
                    <td th:text="${book.edition}">Edition</td>
                    <td>
                        
                        <input type="checkbox" name="ifBorrowed" th:value="${book.ifBorrowed}"/>
                        
                        
                    </td>
                </tr>
            </tbody>
             <div>
<form th:action="@{/set_if_borrowed/}+${book.bookId}">
                <button type="submit" onClick="submit()" class="btn btn-primary">Add to Cart</button>
</form>
            </div>
        </table>

我需要捕获所有选中复选框的值并将它们全部发送到后端。 如何通过将所有复选框值连同书籍 ID 捕获到后端 URL 来对要提交的按钮进行编码。

以下是我的后端代码。

@GetMapping("/set_if_borrowed/")
    @ResponseBody
    public void getIfBorrowedBook(Model model, @RequestParam List<Integer> bookId, @RequestParam List<String> ifBorrowed) {

        System.out.println(bookId+" "+ifBorrowed);

        

    }

基本上我需要 GET 请求 URL 看起来像

/set_if_borrowed?bookId=1&bookId=2&ifBorrowed=true&ifBorrowed=false

如果检查的值为 bookId=1 和 bookId=2