网站倒计时代码,微信小程序应用市场,成都企业网站建设哪家专业,wordpress iis rewrite1.简介 这是Thymeleaf与Spring教程集成的第二部分。 您可以在此处阅读第一部分#xff0c;在那里您将学习如何配置该项目。 如本教程第一部分开头所述#xff0c;Web应用程序将发送两种类型的请求#xff1a; 插入新访客#xff1a;将同步请求发送到服务器以添加新访客。… 1.简介 这是Thymeleaf与Spring教程集成的第二部分。 您可以在此处阅读第一部分在那里您将学习如何配置该项目。 如本教程第一部分开头所述Web应用程序将发送两种类型的请求 插入新访客将同步请求发送到服务器以添加新访客。 这将展示Thymeleaf如何与Spring的表单支持bean集成在一起。 列出来宾发送AJAX请求该请求将更新页面的区域 片段 以显示从服务器返回的来宾列表。 让我们看看我们将如何实现这一目标。 2.处理表格 在本节中我们将了解如何使用Thymeleaf提交表单。 我们基本上需要三个属性 行动 th对象 场 前两个在form元素中定义 form idguestForm th:action{/spring/guests/insert} th:object${guest} methodpost thaction属性重写操作URL为应用程序上下文添加前缀。 表单元素中的thobject属性是对象选择。 然后可以在表单中引用它。 我们在这里所做的是将表单支持bean绑定到model属性该属性是我们在呈现视图之前在控制器中定义的 ModelAttribute(guest)
public Guest prepareGuestModel() {return new Guest();
} 如我们所见 thobject是指Guest表单支持bean而thfield是指其属性。 看一下表单主体 span classformSpaninput idguestId typetext th:field*{id} requiredrequired/br /label forguestId th:text#{insert.id}id:/label
/spanspan classformSpan stylemargin-bottom:20pxinput idguestName typetext th:field*{name} requiredrequired/br /label forguestName th:text#{insert.name}name:/label
/span thfield将要做的就是将其输入元素的值分配给backing bean属性。 因此当用户提交表单时所有这些thfield都将设置表单支持bean属性。 在控制器处我们将收到Guest实例 RequestMapping(value /guests/insert, method RequestMethod.POST)
public String insertGuest(Guest newGuest, Model model) {hotelService.insertNewGuest(newGuest);return showHome(model);
} 现在可以将访客插入数据库。 3.发送AJAX请求 当试图找到一个通过Thymeleaf发送AJAX请求的简单示例时我发现了Spring Webflow 渲染片段 示例。 我还读过其他文章说您需要Tiles才能完成此任务。 我不想使用这些框架因此在本节中我使用jQuery将AJAX请求发送到服务器等待响应并部分更新视图片段渲染。 表格 formspan classsubtitleGuest list form/spandiv classlistBlockdiv classsearch-blockinput typetext idsearchSurname namesearchSurname/br /label forsearchSurname th:text#{search.label}Search label:/labelbutton idsearchButton namesearchButton onclickretrieveGuests() typebutton th:text#{search.button}Search button/button/div!-- Results block --div idresultsBlock/div/div
/form 该表单包含带有搜索字符串searchSurname的输入文本该文本将被发送到服务器。 还有一个区域resultsBlock div将使用从服务器收到的响应进行更新。 当用户单击按钮时retrieveGuests函数将被调用。 function retrieveGuests() {var url /th-spring-integration/spring/guests;if ($(#searchSurname).val() ! ) {url url / $(#searchSurname).val();}$(#resultsBlock).load(url);
} jQuery 加载函数以指定的url向服务器发出请求并将返回HTML放入指定的元素resultsBlock div。 如果用户输入搜索字符串它将搜索具有指定姓氏的所有来宾。 否则它将返回完整的来宾列表。 这两个请求将到达以下控制器请求映射 RequestMapping(value /guests/{surname}, method RequestMethod.GET)
public String showGuestList(Model model, PathVariable(surname) String surname) {model.addAttribute(guests, hotelService.getGuestsList(surname));return results :: resultsList;
}RequestMapping(value /guests, method RequestMethod.GET)
public String showGuestList(Model model) {model.addAttribute(guests, hotelService.getGuestsList());return results :: resultsList;
} 由于Spring与Thymeleaf集成在一起因此它现在能够返回HTML片段。 在上面的示例中返回字符串“ results :: resultsList”是指位于结果页面中的名为resultsList的片段。 让我们看一下这个结果页面 !DOCTYPE html
html xmlnshttp://www.w3.org/1999/xhtmlxmlns:thhttp://www.thymeleaf.org langenhead
/headbodydiv th:fragmentresultsList th:unless${#lists.isEmpty(guests)} classresults-blocktabletheadtrth th:text#{results.guest.id}Id/thth th:text#{results.guest.surname}Surname/thth th:text#{results.guest.name}Name/thth th:text#{results.guest.country}Country/th/tr/theadtbodytr th:eachguest : ${guests}td th:text${guest.id}id/tdtd th:text${guest.surname}surname/tdtd th:text${guest.name}name/tdtd th:text${guest.country}country/td/tr/tbody/table/div
/body
/html 该片段是一个具有已注册访客的表将被插入到结果块中 4。结论 集成了两个框架之后我们学习了如何将表单链接到Spring MVC模型。 我们还学习了如何发送AJAX请求和部分更新视图。 参考来自XavierPadró博客博客的JCG合作伙伴 Xavier Padro 与Thymeleaf与Spring的集成第2部分 。 翻译自: https://www.javacodegeeks.com/2014/03/thymeleaf-integration-with-spring-part-2.html