作为我之前关于使用 Thymeleaf 和阻止页面刷新的问题的后续:
http://forum.thymeleaf.org/Preventing-page-refresh-Thymeleaf-amp-Spring-MVC-td4029155.html
基本上我有一个工作的 Spring MVC 应用程序,它使用 Thymeleaf 来保存表单数据。当用户保存数据时,页面将刷新(因为我想将它们留在页面上以进行更多编辑)并且我想消除页面刷新。
我编写了一些 Javascript 代码以使用 JQuery Ajax 将数据发布到我的 Spring MVC Controller 。诀窍似乎是不使用提交按钮,只使用常规按钮并绑定(bind)一个 JS 函数以将数据发送到服务器。
一切似乎都很完美,但我想确保我了解正在发生的事情。特别是我想知道 Thymeleaf 现在是否多余。我不认为这是因为当我最初加载页面时 Thymeleaf 仍然绑定(bind)到数据 bean。通过在 Controller 中的服务器端使用调试器,发布请求似乎调用了映射方法并将数据传递给模型。
如果您对这是否是实现此目标的正确方法提出意见,我将不胜感激。
最后,我该如何处理错误,例如存储库出于任何原因无法保存数据?
非常感谢。
以下是表单的重要部分:
<FORM id="adminDataForm" action="#" th:action="@{/admin_ajax}" th:object="${adminFormAjax}" method="post">
<input type="button" value="Save Changes" id="post" onClick="sendData()" />
这是 Javascript:
function sendData()
{
$.ajax(
{
type: "POST",
data: $("#adminDataForm").serialize(),
cache: false,
url: "/admin_ajax",
success: function(data)
{
alert("Your changes have been saved");
},
error: function()
{
alert("Error - Data not saved");
}
});
}
这是 Controller :
@SessionAttributes("adminFormAjax")
@Controller
public class TestController
{
final static protected long INDEX_RA = 2L;
@Autowired
private AdminDataRepository rep;
@RequestMapping(value="/admin_ajax", method=RequestMethod.GET)
public String adminFormAjax(Model model)
{
AdminData ad = rep.findById(INDEX_RA);
// If there is no configuration record, create one and assign the primary key
if(ad == null)
{
ad = new AdminData();
ad.setId(INDEX_RA);
}
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;
}
}
最佳答案
所以答案分割。
- Thymeleaf 不是多余的,它仍然会在发送给客户端之前呈现 HTML 页面。 Ajax 只是在客户端为您做进一步的处理。
您也可以使用提交按钮,您只需要确保您的表单结构正确并且您有 javascript 监听您的提交按钮点击,例如
$("#submitbutton").on('click', function (){//do stuff});
您可以像使用标准 Controller 一样在 Ajax Controller 中处理所有异常/问题。您需要将不同级别的问题处理分开。例如存储库级别的问题应该在代表级别进行管理, Controller /pojo 应该在 Controller 级别(如果您使用一个进行处理,则为 pojo)。您还应该通过全局媒介(例如 ControllerAdvice)捕获任何异常。
- 您发现的任何问题/错误都应该通过 adminSubmit 中的返回调用进行反馈,并在 ajax 中管理相关的客户端响应。
关于javascript - Thymeleaf 页面刷新跟进 - 现在使用 AJAX,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31592122/