32

強制的に更新されるように、JavaScript から PrimeFaces コンポーネントを更新することは可能ですか?

ダイアログでこのボタンを使用して ajax 保存呼び出しを行っています。oncomplete イベントにカスタム JavaScript を添付しました。

<p:growl life="1500" id="showmessage"/>
<p:dialog id="addMemberDialog" widgetVar="addMemberDlg">
    <!-- More Code -->
    <p:commandButton value="Save"
        actionListener="#{memberManagedBean.save}"
        oncomplete="handleSaveNewMember(xhr, status, args)"
        update=":memberListForm:membersTable createupdateform "
        process="@form" />
</p:dialog>

..保存ボタンの実行中に、ここにメッセージを追加して、growl コンポーネントを使用してクライアントに表示します。

public void save(ActionEvent event) {
    FacesMessage message = new FacesMessage(FacesMessage.SEVERITY_INFO,
            "Successfuly Add user", "Successfuly Add user");
    FacesContext.getCurrentInstance().addMessage(null, message);

}

私の問題は、うなり声コンポーネントがメッセージを表示する前に、最初にダイアログを非表示にする必要があるように、UI をシーケンスするにはどうすればよいですか?

function handleSaveNewMember(xhr, status, args) {
    addMemberDlg.hide();
    //update the growl after the dialog was hidden?
}

何が起こっているかというと、グロウル コンポーネントが同時にダイアログの横に表示されるということです。

ありがとう。

4

6 に答える 6

58

これには PrimeFaces を使用できます<p:remoteCommand>。

<p:remoteCommand name="updateGrowl" update="showmessage" />

これは次のように呼び出されます

<p:commandButton ... oncomplete="addMemberDlg.hide(); updateGrowl();" />

ただし、この特定のケースでは、より簡単な方法があります。autoUpdateの属性を<p:growl>に設定しますtrue。

<p:growl autoUpdate="true" life="1500" id="showmessage"/>

すべての ajax リクエストで自動更新されます。コンポーネントが実際にそれをサポートしていない場合は、<p:outputPanel>その属性もサポートする でいつでもラップできます。

<p:outputPanel autoUpdate="true">
    ...
</p:outputPanel>
于 2012-05-17T17:03:26.257 に答える
5

いつでもこのようなことができます (保存ボタンの更新属性から showmessage id を削除します)

<h:commandButton style="display:none" id="myBtn" >
    <f:ajax render=":showmessage"/>
</h:commandButton>

function handleSaveNewMember(xhr, status, args) {
    ...
    jQuery("#myBtn").click();
}

編集 しかし、とにかくあなたの現在のコードでは、grwolが更新されていると同時にダイアログが閉じられていませんか?

于 2012-05-17T09:38:17.053 に答える
3

私のアドバイス:

  1. 属性で使用<p:remoteCommand>しactionListenerます。FacesContext.addMessageこの属性は、コードを含むバッキング Bean メソッドを次のように呼び出します。<p:remoteCommand actionListener="myBean.testMethod()" />
  2. 次に、スクリプトで、次の方法で属性をhandleSaveNewMember呼び出します。それで、remoteCommand nameaddMemberDlg.hide();<p:remoteCommand name="testScript" actionListener="myBean.testMethod()"/>function handleSaveNewMember(xhr, status, args) { addMemberDlg.hide(); testScript(); }
  3. ポインティンググロウルコンポーネントにupdate属性を追加:remoteCommand<p:remoteCommand name="testScript" actionListener="myBean.testMethod()" update="showmessage" />
  4. あなたcommandButtonは大丈夫です。

これは私にとってはうまくいきました。

ご挨拶。

于 2014-02-07T20:07:28.413 に答える
0

p:Dialog を < h:panelGroup > 内に配置できないのはなぜですか。お気に入り

< h:panelGroup id="addUser" rendered = "boolean value " >
    < p:dialog id="addMemberDialog" widgetVar="addMemberDlg" >
        <!-- More Code -->
        < p:commandButton value="Save" actionListener="#{memberManagedBean.createOrUpdate}"
                oncomplete="handleSaveNewMember(xhr, status, args)"
                update=":memberListForm:membersTable createupdateform :showmessage :addUser"
                process="@form" />
    < /p:dialog >
< /h:panelGroup>

save メソッドで設定するブール値。save メソッドでこれを false に設定すると、更新中に表示されません。したがって、うなるメッセージだけが表示されます。ただし、この save メソッドを呼び出す前に、このブール値は true に設定されています。

于 2012-05-17T09:43:39.703 に答える
0

p: remotecommand という PrimeFaces 要素を使用できます。この要素は、アクション (たとえば、Bean メソッドを呼び出す) を実行し、そのアクションの後に更新を実行します。

この投稿http://devdublog.blogspot.com/2015/04/best-way-for-calling-method-of.htmlに例があります。

于 2015-04-23T16:47:39.803 に答える