1

PrimeFaces コンポーネントを使用する JSF ページに問題があります。長くてすぐに飽きてしまうかもしれないので、できるだけ簡潔にしようと思います。次のマネージド Bean について考えてみましょう。

@Named(value = "testBean")
@RequestScoped
public class TestBean implements Serializable {

    private String test;

    public String update() {
        test = "Updated.";
        return "test";
    }

    // Getters and Setters...
}

test.xhtml無関係なコンテンツとスタイルが削除された の本文は次のとおりです。

<h:body>
    <p:layout id="layout" fullPage="true">

        <p:layoutUnit position="north">
            <!-- Does not matter -->
        </p:layoutUnit>

        <p:layoutUnit id="input" position="west">
            <p:panel header="">
                <p:tabView>
                    <p:tab title="">
                        <!-- INPUTS and SUBMIT BUTTON -->
                    </p:tab>
                </p:tabView>
            </p:panel>
        </p:layoutUnit>

        <p:layoutUnit id="output" position="center">
            <h:form>
                <p:panel id="display" header="Information">  
                    <h:outputText value="#{testBean.test}" />  
                </p:panel>
                <p:separator />
                    <p:commandButton value="Update !" action="#{testBean.update()}" ajax="false" />
            </h:form>
        </p:layoutUnit>

        <p:layoutUnit position="south">
            <!-- Does not matter -->
        </p:layoutUnit>

    </p:layout>
</h:body>

そして、すべてがうまくいきます。ただし、2つの問題があります。

  1. commandButtonを別のlayoutUnit(入力)に移動する必要がありますが、<h:form>要素を適切な位置に配置できません。すべてのレイアウト ユニットを囲むように横に移動しようとしまし<p:layout>たが、壊れました (更新されたページには "Updated." という文字列がなくなりました)。

  2. 別のlayoutUnitのボタンでajax経由で更新したい。ajax="false"から属性を削除し、グローバル フォーム要素commandButtonの属性を設定するとprependId="false"、出力テキストが更新されません。

よろしくお願いいたします。

4

1 に答える 1

3

commandButton を別の layoutUnit (入力) に移動する必要がありますが、<h:form>要素を適切な位置に配置できません。すべてのレイアウト ユニットを囲むように横に移動しようとしまし<p:layout>たが、壊れました (更新されたページには "Updated." という文字列がなくなりました)。

あなたの具体的な問題を理解しているかどうかわかりません。このようなことをするだけですか？

<p:layoutUnit id="input" position="west">
    <p:panel header="">
        <p:tabView>
            <p:tab title="">
                <!-- INPUTS and SUBMIT BUTTON -->
            </p:tab>
        </p:tabView>
        <h:form>
            <p:commandButton value="Update !" action="#{testBean.update}" ajax="false" />
        </h:form>
    </p:panel>
</p:layoutUnit>

<p:layoutUnit id="output" position="center">
    <p:panel id="display" header="Information">  
        <h:outputText value="#{testBean.test}" />  
    </p:panel>
    <p:separator />
</p:layoutUnit>

別のlayoutUnitのボタンでajax経由で更新したい。commandButton から ajax="false" 属性を削除し、グローバル フォーム要素に prependId="false" の属性を設定すると、出力テキストが更新されません。

updateID は、相対または絶対クライアント ID でなければなりません。正しいクライアント ID を把握する方法については、次の回答を確認してください: ajax update/render のコンポーネントのクライアント ID を確認する方法は? 「bar」から参照される式「foo」を持つコンポーネントが見つかりません

PrimeFaces レイアウト コンポーネントは ではないNamingContainerため、その ID は先頭に追加されません<h:form>。中央のレイアウトを取り出すと<p:panel id="display">、コマンド ボタンから にアクセスできます:display。したがって、これは次のようにする必要があります。

<p:layoutUnit id="input" position="west">
    <p:panel header="">
        <p:tabView>
            <p:tab title="">
                <!-- INPUTS and SUBMIT BUTTON -->
            </p:tab>
        </p:tabView>
        <h:form>
            <p:commandButton value="Update !" action="#{testBean.update}" update=":display" />
        </h:form>
    </p:panel>
</p:layoutUnit>

<p:layoutUnit id="output" position="center">
    <p:panel id="display" header="Information">  
        <h:outputText value="#{testBean.test}" />  
    </p:panel>
    <p:separator />
</p:layoutUnit>
于 2012-09-03T00:34:23.400 に答える