SpringBoot + Thymeleaf動態表與行中的複選框溝通與控制器

Question

也許標題比自己的問題更混亂。這是我的情況，用Thymeleaf我會列出一張客戶列表。它顯示名稱，姓氏，一個按鈕來刪除它，一個複選框，以顯示它的狀態（如果用戶有效或無效）

<table class="table"> 
<thead> 
<tr> 
    <th>Name</th> 
    <th>Last Name</th> 
</tr> 
</thead> 
<tbody> 
<tr th:each="client : ${clientList}"> 
    <td th:text="${client.name}"></td> 
    <td th:text="${client.lastName}"></td> 
    <td> 
     <a th:href="@{/delete_client/} + ${client.id}" class="btn btn-danger">Delete</a> 
    </td> 
    <td> 
     <input type="checkbox" name="my-checkbox" th:checked="${client.state} ? 'checked'"> 
    </td> 

</tr> 
</tbody> 

到目前爲止，沒有任何問題。但是我不知道該怎麼做是在用戶點擊複選框時爲控制器通信，以便禁用或啓用該特定客戶端。

類似於按鈕用來刪除客戶端，但改變它的狀態。

我被告知使用AJAX，但不知道如何。

謝謝！

Answer 1

你可以避開ajax。用於刪除酷似效果可以應用以下步驟來包含複選框td元件：

• 包裹中的複選框form標籤
• 提供在form適當action屬性。的動作是處理一個客戶端的狀態（到相若方式/delete_client/）的更新
• 提供在複選框onclick="submit();"屬性，當用戶點擊它

例如將觸發提到的端點的端點

<td> 
    <form th:action="@{/switch_client_state/} + ${client.id}"> 
     <input type="checkbox" name="my-checkbox" onclick="submit();" th:checked="${client.state} ? 'checked'"> 
    </form> 
</td>