带有模型和百里香叶的 Spring Boot Ajax 发布表单提交
Posted
技术标签:
【中文标题】带有模型和百里香叶的 Spring Boot Ajax 发布表单提交【英文标题】：Spring Boot Ajax post form submit with model and thymeleaf 【发布时间】：2019-03-30 04:17:21 【问题描述】：我有一个 Spring Boot 控制器，它返回一个视图，我想通过使用 ajax 端点来更改它，但同时使用 modelAttribute 从表单中获取值，然后在页面上发送一个或多个列表并用百里香遍历这些列表。有可能吗？ 这是控制器：
@RequestMapping(value="/search", method=RequestMethod.POST)
@ResponseBody
public String search(@ModelAttribute("specification") Specification specification, Model model)
List<SearchResultAutovit> list;
list = scrapper.searchMethod(specification.getPrice,specification.getModel);
if (list == null || list.isEmpty())
model.addAttribute("msg","Something");
else
model.addAttribute("listaAutovit", list);
return "?";
Ajax 请求：
$(".btn.btn-danger").on('click', function fire_ajax_submit()
var str = $(".form-inline.justify-content-center").serialize();
$.ajax(
type:"post",
data:str,
url:"/search",
async: false,
dataType: "json",
success: function()
alert("success");
);
我不想从 ajax 成功部分操作页面，因为当模型发送到页面时，我已经在使用 thymeleaf 进行操作。
【问题讨论】：
【参考方案1】：所以你想要的是使用ajax 请求接收一个 Thymeleaf 片段。您可以通过更改以下代码并添加片段来实现此目的，您将在其中添加属性。我们将创建一个名为 list 的 html 文件，我们将在其中保存片段。
百里香片段
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<body>
<th:block th:fragment="list">
<th:block th:if="$list != null">
<th:block th:each="iterator: $list">
<!-- Do something -->
</th:block>
</th:block>
<th:block th:if="$msg != null">
<p th:text=$msg></p>
</th:block>
</th:block>
</body>
</html>
控制器
@RequestMapping(value="/search")
public String search(@ModelAttribute("specification") Specification specification, Model model)
List<SearchResultAutovit> list;
list = scrapper.searchMethod(specification.getPrice,specification.getModel);
if (list == null || list.isEmpty())
model.addAttribute("msg", "Error!");
model.addAttribute("list", list);
else
model.addAttribute("list", list);
model.addAttribute("msg", null);
return "layouts/list :: list";
然后在您的ajax 上，您只需要接收结果并将其附加到一个元素。
$.ajax(
type:"post",
data:str,
url:"/search",
dataType: "json",
success: function(result)
$(element).append(result);
);
希望对你有帮助。
【讨论】：
感谢您的回答！不，我只想提交表单，然后将一些列表发送到页面，用百里香遍历这些列表，然后基本上从列表中返回带有这些值的页面......但我想异步进行，所以页面不会' t 刷新 :( 好的，现在我知道你想要什么了。我刚刚编辑了我的答案。现在您将返回一个带有所需列表的 Thymeleaf 片段。希望它现在有所帮助。另外，现在建议使用async:false 和ajax。
我不确定我现在做错了什么，因为当我提交表单时，它会从控制器返回字符串
你在那个字符串中收到了什么？您应该会收到一个带有我发送给您的代码的 html。
我收到字符串“layouts/list :: list”以上是关于带有模型和百里香叶的 Spring Boot Ajax 发布表单提交的主要内容，如果未能解决你的问题，请参考以下文章