我正在尝试编写应用程序的前端,但是遇到了问题。我一直在尝试使用AJAX实现DELETE方法,但是根据Spring的说法,当我运行代码时会发送GET。
HTML代码:
<tr th:each="attraction : ${attractions}" th:object="${attraction}">
<td th:text="*{name}"></td>
<td th:text="*{latitude}"></td>
<td th:text="*{city}"></td>
<td><a th:href="|/edit/*{id}|">EDIT</a></td>
<script>
function sendDelete(event) {
xhttp.preventDefault();
xhttp.open("DELETE", this.href);
xhttp.send();
}
</script>
<td><a th:href="|/delete/*{id}|" onclick="sendDelete(event);">DELETE</a></td>
</tr>
春季代码:
@DeleteMapping("/delete/{id}")
String delete(@ModelAttribute Attraction attraction) {
attractionService.delete(attraction);
return "redirect:/";
}
我该如何解决这个问题?预先谢谢你。
答案 0 :(得分:2)
您花了很长时间解决此问题。
只要使用JavaScript处理链接代码并调用preventDefault,Link标记就可以发送所需的任何http方法。
但是您必须对传递到点击处理程序中的事件(而不是xhttp pbject)进行处理。所以在事件处理程序上,您应该已经完成
event.preventDefault()
而不是:
xhttp.preventDefault()
您的表格骇客不是惯用的。它将吓到下一个使用该代码的人!
答案 1 :(得分:-1)
在一些帮助下,我可以找出问题所在。基本的问题是
标记只能处理GET方法。
代替我的那部分代码,我将其整理成HTML:
<td>
<form th:method="DELETE" th:action="|/delete/*{id}|">
<input type="submit" value="Send">
</form>
</td>
现在它可以正常工作了。