ui:repeatの中のf:ajax

自分メモ。

ui:repeatの中でf:ajaxを使う場合、renderの指定の仕方に注意が必要です。

例えばui:repeatでボタンを配置し、自身を含む親タグ全体を再描画したい場合、

<f:ajax render=":f:list" />

のように根元からのパスを指定しないといけないようです。
頭の : を忘れるんですよね。。。

サンプル

f:ajaxが２ヶ所に出てきていますが、renderの指定の仕方がちがうことに注目。

<h:form id="f">
    <h:inputText value="#{employees.name}" />
    <h:commandButton value="追加" action="#{employees.insert(employees.name)}">
        <f:ajax render="list" />
    </h:commandButton>
    <hr/>
    <h:panelGroup id="list">
        <ul>
            <li jsfc="ui:repeat" value="#{employees.all}" var="e">
                #{e.id} : #{e.name} : 
                <h:commandButton action="#{employees.delete(e)}" value="削除">
                    <f:ajax render=":f:list" />
                </h:commandButton>
            </li>
        </ul>
    </h:panelGroup>
</h:form>

BK

上記サンプルにはちょっとしたバッドノウハウがあります。
ボタンを押したときにulタグ全体を再描画したいのですが、ul相当のFaceletsタグはありません。そこでh:panelGroupでulタグを囲みます。
こうするとspanタグでulタグが囲まれるので、これを再描画するようにしています。

カスタムタグを作ってもいいのですが、ま、これもアリでしょう。。。