0

次のようなリストを受け取るビューがあるとします。

@(notices: Seq[Notice])

@for( not <- notices) {
   <tr> not.title </tr>
}
....

そして、コントローラーにajaxによる呼び出しとリストの値を変更するメソッドがあります。メソッドが Result を返し、次のように新しい値でページを再レンダリングできることを私は知っています。

public Result editNotice() {
   /*change the list */
   return ok(list.render(notices);
}

しかし、リストがあるテーブルだけを更新したいです。

ページ全体をリロードせずにビューのリストを更新するにはどうすればよいですか?

4

2 に答える 2

1

テーブル部分だけをレンダリングするための小さなビューを作成してeditNoticeアクションで使用するだけで、AJAX 応答を受け取った後、既存のものを JavaScript (おそらく jQuery) に置き換えます。

docs に示されているように、2 つのビューで同じテーブル マークアップを作成する必要がないことを確認するには、他のビューからインクルードテンプレートを使用できることに注意してください。

したがって、AJAX アクションは次のようになります。

public Result editNotice() {
   return ok(table.render(notices);
}

そしてあなたのlist.scala.html：

@(notices: Seq[Notice])

@table(notices)
....

そしてあなたのtable.scala.html：

@(notices: Seq[Notice])

<table>
  @for(not <- notices) {
    <tr><td>@not.title</td></tr>
  }
</table>

その他の解決策

から JsonNode - オブジェクトの配列 - を返し、editActionJS で新しいテーブルを構築しています。

于 2016-05-18T18:48:53.360 に答える
0

最後に、コントローラーから結果を返すことを解決しましたが、html のコンテンツを javascript と div に置き換えました。

コントローラ：

public Result editNotice() {
   return ok(table.render(notices);
}

HTML: list.scala.html

@()

<div id="table">
</div>
<li>
    <a class="ajax-call" href="#table" onclick="$('#table').load('/editNotice';"/>
</li>

HTML: table.scala.html

@(notices: Seq[Notice])
  <table>
     @for(not <- notices) {
       <tr><td>@not.title</td></tr>
     }
  </table>
于 2016-08-25T14:15:54.187 に答える