将 thymeleaf 表值发送到 controller

Question

我想根据按钮单击使用 ajax 将我的 thymeleaf 表行发送到 controller。 下面是我到目前为止的尝试

<button id="sisi" type="button" class="btn btn-primary" th:text="#{aji}">

<tr id="rikaList" th:each="rika:${allRikas}">
     <td th:text="${rika.customer.customerNumber}"></td>
     <td th:text="${rika.customer.customerName}"></td>
     <td th:text="${rika.customer.nicNo}"></td>
</tr> 

<script type="text/javascript">
    $("#sisi").on('click', function () { 
        var contents = $("#rikaList").val();
        $.ajax({
            type: 'GET',
            url: "/bow/generateReport/" + contents,
            data: {},
            success: function (response) {

            }
        });
    })
</script>  

下面你可以看到我的 controller

@GetMapping(path = "/bow/generateReport/{rikaList}")
public void getCustomerByBranch(@PathVariable List<Rika> rikaList) {

}

Answer 1

我不知道我是否了解您想要做什么，但我认为您应该使用 POST 并将列表发送到正文中。

Controller

@PostMapping(path = "/bow/generateReport")
public void getCustomerByBranch(@RequestBody List<Rika> rikaList) {

}

JS：

var rikaList = [] //create the list with values you need
var request = $.ajax({
    url : '/bow/generateReport',
    type : 'POST',
    data : JSON.stringify(rikaList),

    ...
});

如何创建列表：

您已经用 id 定义了 tr，也许您想将 id 放入父级，因为 th:each 会用我认为的 id 重复 tr。 所以，用 id 代替标签：

var rikaList = []
    $('#rikaList > tbody > tr').each(function(index, tr) {
        var rika = {
            customerNumber: tr.cells[0].innerText, 
            customerName:tr.cells[1].innerText, 
            nicNo:tr.cells[2].innerText}
        rikaList.push(rika)
    });

会有更好的方法来遍历表，但如果结构始终相同，您可以创建 object 列表。