2

まず第一に、私は主にJSFバックグラウンドを持っています。

最近勉強を始めましSpring MVCた。私を悩ませているのは、Spring MVCとを使用するときに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

まず第一に、SpringMVCは非常に柔軟性があります。ビューエンジンによって生成されたHTMLを返すバックエンドハンドラーを使用したり、JSON / XML / ProtocolBuffers/etcを返すハンドラーを使用したりできます。Mustacheなどのクライアント側のレンダリングエンジンを使用してページをブラウザに表示するか、同じアプリケーションで2つを組み合わせることができます。

サーバー上でHTMLを生成する場合、SpringMVCではさまざまなテンプレートエンジンを使用してそれを行うことができます。JSP、Freemarker、Velocityなどを使用できます。これを行うには、ViewResolver抽象化を使用し、コードではModelAndViewAPIを処理するだけで済みます。

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 に答える
2

基本的に、2つのオプションがあります。

  1. 最初のレンダリングでも、常にajaxを使用してテーブルをロードします（JavaScript関数でのみテーブル作成コード）
  2. ajax / loadPeople.doを変更して、Jsonリストの代わりに既にレンダリングされたテーブルを返します。次に、JSPタグファイルのpeopleテーブルレンダリングコードを因数分解するか、テンプレートライブラリ（タイルなど）を使用してそのJSPフラグメントを再利用できます。
于 2012-10-13T09:57:43.033 に答える