html – 我可以在Spring Boot应用程序中从Thymeleaf表发出HTTP POST请求

我在一个简单的 Spring Boot应用程序中有一个Thymeleaf模板.该模板在表中包含一个列表,如下所示:

<p>There are <span th:text="${#lists.size(persons)}"></span> people:</p>
<table th:if="${not #lists.isEmpty(persons)}" border="1">
    <tr>
        <th>ID</th>
        <th>Name</th>
        <th>Address</th>
        <th>Telephone</th>
        <th>Email</th>
        <th>Actions</th>
    </tr>
    <tr th:each="person : ${persons}">
        <td th:text="${person.personId}"></td>
        <td th:text="${person.name}"></td>
        <td th:text="${person.address}"></td>
        <td th:text="${person.telephone}"></td>
        <td th:text="${person.email}"></td>
        <td>
            <a href="#" data-th-href="@{/edit(personId=${person.personId})}">Edit</a> |
            <a href="#" data-th-href="@{/delete(personId=${person.personId})}">Delete</a>
        </td>
    </tr>
</table>

我想根据表格中的最后一个单元格启用编辑和删除功能.但目前这两个请求都是针对HTTP GET的.这对于从服务器获取人员的详细信息以进行编辑的编辑很好,但是由于服务器上的数据更改,删除应该触发POST请求.

有没有人知道Thymeleaf是否允许每行一个表的POST请求?或者我是否必须每行编写一个简单的HTML表单?

GET表格目前是:

<td>
    <a href="#" data-th-href="@{/edit(personId=${person.personId})}">Edit</a>
    <!--a href="#" data-th-href="@{/delete(personId=${person.personId})}">Delete</a></td-->
    <form method="get" th:action="@{/edit(personId=${person.personId})}">
        <button type="submit" name="submit" value="value">Edit</button>
    </form>
</td>

我有一个链接一个表格进行测试.

调用的控制器方法是:

// Gets a Person.
@RequestMapping(value="/edit",method=RequestMethod.GET)
public String getEditPerson(@RequestParam("personId") String personId,Model model) {
    logger.info(PersonController.class.getName() + ".getEditPerson() method called."); 

    Person person = personDAO.get(Integer.parseInt(personId));
    model.addAttribute("person",person);

    // Set view.      
    return "/edit";
}

调用GET按钮版本时的错误是:

Whitelabel Error Page

This application has no explicit mapping for /error,so you are seeing this as a fallback.

Sun Jul 24 00:26:16 BST 2016
There was an unexpected error (type=Bad Request,status=400).
required String parameter 'personId' is not present`

我正在使用GET来触发编辑,因为除了personId之外,没有数据发送到服务器.没有采取数据库操作,所以它应该是GET.

解决方法

你正在使用链接,我认为这是不可能的,你需要使用一个表格,你可以指定要使用的方法POST.

在下面的示例中,使用< button>而不是< a>元素,但它会工作,你唯一需要做的就是用CSS设置你的按钮样式,看起来像你的链接

<form method="POST" th:action="@{/edit(personId=${person.personId})}">
    <button type="submit" name="submit" value="value" class="link-button">This is a link that sends a POST request</button>
</form>

现在你的代码应该是这样的

<tr th:each="person : ${persons}">                
    <td th:text="${person.personId}"></td>
    <td th:text="${person.name}"></td>
    <td th:text="${person.address}"></td>
    <td th:text="${person.telephone}"></td>
    <td th:text="${person.email}"></td>
    <td>
        <form method="POST" th:action="@{/edit(personId=${person.personId})}">
            <button type="submit" name="submit" value="value" class="link-button">EDIT</button>
        </form> | 
        <form method="POST" th:action="@{/delete(personId=${person.personId})}">
            <button type="submit" name="submit" value="value" class="link-button">DELETE</button>
        </form>
    </td>
</tr>

编辑

当您刚刚分享Java代码时,在控制器中您期望personId不是PathVariable,而是作为RequestParam,
在这种情况下,你的表格应具有这个价值……

编辑您的表单并添加人员ID,如下所示.

<form method="POST" th:action="@{/edit}">
    <input type="hidden" name="personid" id="personId" th:value="${person.personId}" />
    <button type="submit" name="submit" value="value" class="link-button">This is a link that sends a POST request</button>
</form>

另请注意,我将表单的操作更改为/ edit,就像控制器的外观一样

相关文章

vue阻止冒泡事件 阻止点击事件的执行 &lt;div @click=&a...
尝试过使用网友说的API接口获取 找到的都是失效了 暂时就使用...
后台我拿的数据是这样的格式: [ {id:1 , parentId: 0, name:...
JAVA下载文件防重复点击,防止多次下载请求,Cookie方式快速简...
Mip是什么意思以及作用有哪些