[JSF] f:ajaxとui:repeat

JavaのWebアプリケーションフレームワークであるJSFを仕事で使う機会があったので、
備忘録を残そうと思います。

         使用環境

  • NetBeans8.2
  • JavaEE7.0
  • GlassFish4.1.1

JSFのAjaxでui:repeatを再描画

JSFの画面でAjaxを活用したい時は専用のf:ajax要素が用意されている。
これを活用して、繰り返し表示の際によく使用されるui:repeat要素の部分を再描画してみる。

【実行イメージ】
JSF6-1
JSF6-2

つまり、テキストボックスの入力内容によって、リスト部分だけを再描画するサンプルです。

【view】

【ManagedBean】

【Bean】

処理の流れをまとめると

  1. 最初のリクエスト時に、viewのf:metadata要素のf:viewActionに定義されたinitメソッドの処理を実行
  2. ページ表示
  3. テキストボックスに「1」を入力して、送信ボタンをクリック
  4. 送信ボタンの要素であるh:commandButtonの子要素に、f:ajaxが設定されているので以下の処理が行われる
    • event属性に設定されたイベント名がトリガー(今回はクリック)
    • execute属性に設定されたidを持つコンポーネントを処理。(今回はテキストボックスの値がManagedBeanの変数inputTextに設定される)
    • listener属性に設定されたManagedBeanのメソッドの実行(今回はchangeDispList()メソッドの実行)
    • render属性に設定されたidを持つコンポーネントの再描画(今回はui:repeatの親要素であるh:panelGroup)

ちなみにui:repeatはHTML変換時の要素が存在しないので、今回みたいにh:panelGroupなどの設定したidが画面表示後に残る要素の子要素に設定する必要があります。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする