2

首先，我主要是有JSF背景的。

我最近开始学习了Spring MVC。Spring MVC困扰我的一件事是使用and时的 ajax 重新渲染JQuery。

假设我在我的people.jsp视图中定义了一个复杂的形式：

<c:forEach var="person" items="${people}">
   <table>
       <tr class="trPersonClass">...</tr>
       <tr>...</tr>
   </table>
</c:forEach>

我在refresh下面有一个按钮。单击刷新按钮时，我想要ajax重新people渲染。

function refreshButtonClicked() {
    $.ajax({
       type: "GET",
       url: "ajax/loadPeople.do"
    }).done(function( msg ) {   
        //WHAT SHOULD I DO HERE???            
    } 
});

那么我应该在那里做什么？我已经用c:forEach我的jsp. 我不想再重复一遍。我不想在两个地方重复用户界面代码 - 在JQuery完成回调中和JSP在我的视图中使用标签。我认为这很容易出错。

请解释一下我在这里缺少什么。

4

2 回答 2

2

基本上，我看到 2 个选项：

  1. 始终使用 ajax 加载表格，即使在第一次渲染时（表格创建代码仅在您的 javascript 函数中）
  2. 修改 ajax/loadPeople.do 以返回已呈现的表格而不是 Json 列表。然后，您可以将人员表呈现代码分解到 JSP 标记文件中，或者使用一些模板库（图块等）来重用该 JSP 片段。
于 2012-10-13T09:57:43.033 回答
2

首先，Spring MVC 非常灵活。您可以拥有返回由视图引擎生成的 HTML 的后端处理程序，您可以拥有返回 JSON/XML/ProtocolBuffers/等的处理程序。并使用 Mustache 等客户端渲染引擎在浏览器中显示页面，或者您可以将两者结合在同一个应用程序中。

如果你想在服务器上生成 HTML，Spring MVC 允许你使用不同的模板引擎来做到这一点。您可以使用 JSP、Freemarker、Velocity 等。为此，它使用 ViewResolver 抽象，并且在您的代码中您只需要处理 ModelAndView API。

关于 ViewResolver 的更多细节可以在这里找到：http ://static.springsource.org/spring/docs/3.0.x/reference/mvc.html

根据您的问题，听起来您有一个使用 JSP 创建 html 服务器端的后端。为了在用户单击刷新按钮时仅更新表而不重新加载整个页面，例如，您可以有一个仅返回 html 表的处理程序，如下所示：

@RequestMapping("/table")
public ModelAndView renderTable() {
   List<People> people = peopleService.findAllPeople();
   return new ModelAndView("/people", "people", people);
}

我还假设您有另一个处理程序，它返回通过 ajax 嵌入表格的主页。

<body>
    ...
    /* Content of div will be populated via ajax*/
    <div id="myTableContainer" />
    ...
</body>

用于此的 javaScript 将类似于：

$(function() {

  var myTableContainer = $("#myTableContainer");

  var renderTable = function(container) { 
    $.get("/table", function(data) {
      container.empty().html(data);
    }
  };

  /* This is called on document ready */
  renderTable(myTableContainer);

  /* Use the same renderTable function when the refresh button is clicked */
  $("#refreshButton").click(function() {
      renderTable(myTableContainer);
  });
}
于 2012-10-13T09:35:14.587 回答