当前位置: 首页 > 工具软件 > Ra-Ajax > 使用案例 >

thymeleaf和ajax区别,Thymeleaf页面刷新跟进-现在使用AJAX

司寇阳朔
2023-12-01

作为我之前有关使用Thymeleaf并防止页面刷新的问题的跟进:

基本上,我有一个可以正常工作的Spring

MVC应用程序,该应用程序使用Thymeleaf保存表单数据。当用户保存数据时,页面将刷新(因为我想将它们留在页面上进行更多编辑),并且我想消除页面刷新。

我已经编写了一些Javascript以使用JQuery Ajax将数据发布到我的Spring MVC

Controller。诀窍似乎是不使用Submit按钮,而只是使用常规按钮,并绑定JS函数以将数据发送到服务器。

一切似乎都工作正常,但我想确保我了解正在发生的事情。我特别想知道Thymeleaf现在是否多余。我不认为这是因为最初加载页面时Thymeleaf仍绑定到数据bean。通过在控制器的服务器端使用调试器,发布请求看起来就像调用了映射的方法并将数据传递给模型。

感谢您对这是否是实现此目标的正确方法的评论。

最后,我该如何处理错误,例如说存储库由于任何原因无法持久保存数据?

非常感谢。

这是表格的重要部分:

这是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");

}

});

}

这是控制器:

@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;

}

}

 类似资料: