4

ボタンをクリックすると、ある panelGroup を別の panelGroup に置き換える単純なページを作成しています。まず、コード:

<h:body>

    <ui:composition template="/elements/templateWithMenu.xhtml">           
        <ui:define name="content">
            <div class="rightContent">

                <h:panelGroup id="lol" rendered="#{test.firstStep.booleanValue()}">

                    <h3>This should disappear</h3>

                    <h:form id="newPollForm1" rendered="#{test.firstStep.booleanValue()}"> 
                        <fieldset>
                            <h:commandLink value="Next" action="#{test.firstStepCompleted()}" >
                                <f:ajax execute="@all" render="lol" />
                            </h:commandLink>
                        </fieldset>
                    </h:form>

                </h:panelGroup>

                <h:panelGroup rendered="#{test.secondStep.booleanValue()}">
                    Works!
                </h:panelGroup>

            </div>     
        </ui:define>
    </ui:composition>

</h:body>

バッキング Bean は、単純に firstStep を false に設定し、secondStep を true に設定します。

さて、これを実行してみると、<f:ajax> contains an unknown id 'lol' - cannot locate it in the context of the component j_idt39. 少しグーグルで調べたところ、フォームの範囲外の要素については、SEPARATOR_CHAR (:) を使用する必要があることがわかりました。それはうまくいきませんでした。だから私は #{component} と #{cc} のさまざまな組み合わせをいじってみましたが、何もうまくいきません。この素晴らしい説明も見つけましたが、やはり惨めに失敗しました。@all を使用すると、すべてうまくいきます (あるパネルが別のパネルに置き換えられます) が、実際には特定のコンポーネントをレンダリングする必要があります。

ヘルプ?お願いします?

4

1 に答える 1

5

代わりに、共通の親を更新する必要があります<div class="rightContent">。これは常にレンダリングされるため、JavaScript/Ajaxがその子にアクセスして維持できることが保証されます。に置き換えて<h:panelGroup layout="block">、を付けますid

<h:panelGroup layout="block" id="content" class="rightContent">
    <h:panelGroup rendered="#{test.firstStep}">
        <h3>This should disappear</h3>
        <h:form id="newPollForm1"> 
            <fieldset>
                <h:commandLink value="Next" action="#{test.firstStepCompleted()}" >
                    <f:ajax execute="@form" render=":content" />
                </h:commandLink>
            </fieldset>
        </h:form>
    </h:panelGroup>

    <h:panelGroup rendered="#{test.secondStep}">
        Works!
    </h:panelGroup>
</h:panelGroup>

このTest.javaクラスの使用:

import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;

@ManagedBean
@ViewScoped
public class Test {
    private int number = 0;

    public void firstStepCompleted() {
        number++;
    }

    public boolean isFirstStep() {
        return number == 0;
    }

    public boolean isSecondStep() {
        return number == 1;
    }
}

フォーム上の不要なBoolean#booleanValue()呼び出しと重複した内容を削除したことに注意してください。rendered

それでも機能しない場合は/elements/templateWithMenu.xhtml、IDを付加した別のネーミングコンテナコンポーネントが含まれているようです。すべてのネーミングコンテナコンポーネントをまだ覚えていない初心者の場合、実際の正しいクライアントIDを把握する簡単な方法は、ブラウザでページを開き、右クリックして[ソースを表示]を選択し、JSFで生成されたHTML要素を見つけてそのid属性値を正確に取得することです。 (そして、:の前にそれを付けます<f:ajax render>)。

于 2012-05-29T17:32:21.543 に答える