Spring 4和Thymeleaf -防止页面刷新
我保证，我已经在谷歌上搜索过了。
我有一个Spring 4应用程序，它使用Thymeleaf收集表单数据并将其放入数据库。工作非常好，除了我希望我的应用程序在用户点击提交按钮后离开表单页面，这样他们就可以继续编辑了。
每次单击submit时，将调用Controller并返回视图，这将导致页面刷新。我想要取消刷新，并添加一个警报来确认保存。
因此，我开始将表单提交转换为AJAX，并意识到这将违背使用Thymeleaf的目的。Thymeleaf已经将表单字段映射到后台bean，并且做得很好，那么为什么要替换这个机制呢？
那么，是否有办法让Spring控制器处理提交请求，而不返回视图的新实例？
我尝试不返回视图，但这导致了一个错误，因为没有将任何内容映射到模型属性。我尝试使用@ResponseBody并返回数据，但这导致JSON在web页面中呈现，而且我无法弄清楚如何使该数据愉快并对其进行操作。
我还试图找到一种连接到submit按钮的方法，尝试调用javascript preventDefault()，但在那里没有任何进展。
非常感谢你的建议。
以下是我的控制器代码，非常简单：
@SessionAttributes("adminFormAjax")
@Controller
public class TestController
{
@Autowired
private AdminDataRepository rep;
@RequestMapping(value="/admin_ajax", method=RequestMethod.GET)
public String adminFormAjax(Model model)
{
AdminData ad = rep.findById(1L);
// If there is no configuration record, create one and assign the primary key as 1.
if(ad == null)
{
ad = new AdminData();
ad.setId(1L);
}
model.addAttribute("adminFormAjax", ad);
return "adminFormAjax";
}
@RequestMapping(value="/admin_ajax", method=RequestMethod.POST)
public @ResponseBody AdminData adminSubmit(@ModelAttribute("adminFormAjax") AdminData ad, Model model)
{
// rep.save(ad);
model.addAttribute("adminFormAjax", ad);
return ad;
}
}回答 3
Stack Overflow用户
发布于 2015-07-22 01:29:54
因此，如果您想要将表单数据提交给控制器而不需要更改页面，则可以将页面呈现为HTML，并将其发送给客户端以显示。
您肯定需要使用javascript/ajax来发布表单内容并保持页面的原样。
如果您只想更新包含表单的部分，例如，您可以调用一个控制器方法，该方法返回一个片段并显示包含相关表单信息的片段。
Stack Overflow用户
发布于 2018-05-03 04:35:03
希望这能对未来的读者有所帮助。我们可以使用th:替换来避免javascript/ajax。见下面的例子。
@GetMapping("/admin-reload")
public String reloadElementDiv(Model model) {
AdminData ad = rep.findById(1L);
// If there is no configuration record, create one and assign the primary key as 1.
if(ad == null)
{
ad = new AdminData();
ad.setId(1L);
}
model.addAttribute("adminAttrib", ad);
return "adminForm";
}现在，在父html (如home.html)中使用以下内容。*这意味着用来自id=的admin.html中的“admin-div”元素替换这个标记。
<div th:replace="~{admin :: #admin-div}">
</div>然后，在一个单独的html文件中，放置片段html代码。在这个例子中，它的admin.html。
<div id="admin-div">
<span th:text="${ad.id}"></span>
</div>您可以使用th:href设置一个链接/按钮来触发刷新div元素。
<a href="" th:href="@{/admin-reload}"><span>Edit</span></a>Stack Overflow用户
发布于 2020-11-09 15:32:16
我使用rest控制器和ajax来处理这个问题
https://stackoverflow.com/questions/31546424
复制相似问题
腾讯云开发者
