1

p:wizardコンポーネント内に PrimeFacesがありp:dialogます。次/前のステップにカスタム ボタンを使用しています。

<p:commandButton value="Weiter" onclick="wiz.next()">

ウィザードを含むダイアログの要素を変更したいのですが、私の場合はダイアログヘッダーです:

<p:dialog id="dialogRespWizard"
        header="#{wizardBean.header}"

コードを次のように変更しました。

<p:commandButton value="Weiter" onclick="wiz.next()" update="dialogRespWizard">

しかし、次のステップを選択すると、ダイアログ全体が消えます。

では、ステップ変更時にウィザードの「周囲」を更新するにはどうすればよいですか?

4

2 に答える 2

5

あなたの質問について：

ダイアログ全体を更新するため(ダイアログ要素全体が HTML ページから削除され、サーバーから受信した新しいダイアログ HTML 要素に置き換えられることを意味します)、ダイアログが非表示になります。これは意図的なものです。ダイアログ内の何かを更新したい場合は、ダイアログ内にある種のXXXpanelを作成し、その XXXpanel を更新する必要があります (HTML ダイアログ要素のラッピングは同じで、ダイアログのコンテンツだけがサーバーから受信した新しいコンテンツに置き換えられます):

<p:dialog id="dialogWizard" header="something">
  <p:outputPanel id="outputPanelWizard">
    // a lot of stuff which needs to get updated
  </p:outputPanel>
  <p:commandButton .... update="outputPanelWizard" />
</p:dialog>

...そして、ダイアログは再び非表示になりません。したがって、ヘッダーをすでに行っているファセットに配置する必要があります。正しい方向に一歩進んでください。




あなたの自己回答の質問に：

onclickとupdateを使用しているため、「点滅」が表示されます。Onclickは、ユーザーがp:commandButtonをクリックするとすぐに実行されます。ただし、更新はサイクルの後半 (ブラウザーがサーバーからの応答を受信したとき) に発生することがあります。したがって、ウィザードはwiz.next()で切り替わり、その後ダイアログ ヘッダーで更新が行われます。onclickの代わりにoncompleteを使用するだけで、ブラウザがサーバーからの応答を受信した後、ダイアログが更新された後に切り替えが行われ、 「点滅」しなくなります。他のいくつかのソリューションも存在します。



p:commandButton で onclick/oncomplete/update を使用しないでください。代わりに、アクション/*actionListener*のすべてをRequestContextで処理します (ここでRequestContext Showcaseを参照) 。

this.header = "my new header";
context.execute("wiz.next();"); 
context.update("outputPanelWizard");

利点は、フォーム（ユーザー入力）を評価し、適用可能かどうかにかかわらずwiz.next()に切り替えることができるという私見です。ユーザー入力が満足できない場合は、同じページにとどまることができますが、wiz.next()を呼び出さないでください。同じことがヘッダーにも当てはまります。ユーザー入力に関してバッキング Bean で更新できます。

于 2012-11-30T16:34:43.257 に答える
2

そのため、ヘッダーをfacetに移動することでこの問題に対処しました。ファセットでは、任意の ID でoutputTextを使用し、ウィザード アクションの後に ID でこのコンポーネントを更新できます。

<p:dialog id="dialogWizard">
<f:facet name="header">
  <h:outputText id="dialogHeader" value="#{wizard.header}" />
</f:facet>

<p:commandButton value="Weiter" onclick="wiz.next()" update="dialogHeader">

このソリューションの唯一の問題は、ステップ変更後のヘッダーの目に見える「点滅」です。ダイアログの内容が最初に変更され、次にヘッダーが変更された直後に、この不一致がユーザーに表示されます。

于 2012-11-30T07:45:21.780 に答える