Как вызвать обновление компонента из javascript в файлах?

Возможно ли обновить компонент PrimeFaces из javascript, чтобы он мог обновиться?

Я делаю вызов сохранения ajax с помощью этой кнопки в диалоговом окне. Я приложил свой собственный 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);

}

Моя проблема в том, как я могу настроить пользовательский интерфейс таким образом, что я должен скрыть диалог перед тем, как компонент рычания может показать сообщение?

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

Что происходит, когда компонент growl отображается вместе с диалогом одновременно.

Спасибо.

Ответы

Ответ 1

Для этого вы можете использовать <p:remoteCommand> для PrimeFaces.

<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>

Ответ 2

вы всегда можете сделать что-то вроде этого (удалите идентификатор showmessage из атрибута обновления кнопки сохранения)

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

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

ИЗМЕНИТЬ Но так или иначе в вашем текущем коде не закрывается диалоговое окно в то же время, когда обновляется grwol?

Ответ 3

Мой совет:

Используйте <p:remoteCommand> с атрибутом actionListener. Этот атрибут вызывает метод поддержки bean, содержащий код FacesContext.addMessage, таким образом: <p:remoteCommand actionListener="myBean.testMethod()" />
Далее, в handleSaveNewMember script, вызовите атрибут remoteCommand name после addMemberDlg.hide(); следующим образом: <p:remoteCommand name="testScript" actionListener="myBean.testMethod()"/>. Тогда function handleSaveNewMember(xhr, status, args) { addMemberDlg.hide(); testScript(); }
Добавить атрибут update в remoteCommand указательный компонент growl: <p:remoteCommand name="testScript" actionListener="myBean.testMethod()" update="showmessage" />
Ваш commandButton в порядке.

Это сработало для меня.

Привет.

Ответ 4

Почему вы не можете поставить p: Диалог внутри < 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>

boolean значение, которое должно быть установлено в вашем методе сохранения. при установке этого параметра как false в вашем методе сохранения, он не будет отображаться при его обновлении. Так появится сообщение рычание. Но перед вызовом этого метода save это логическое значение установлено как true.

Ответ 5

Вы можете использовать элемент PrimeFaces, называемый p: remotecommand. Этот элемент будет выполнять действие (например, вызвать метод bean) и выполнить обновление после этого действия.

В этом сообщении есть пример http://devdublog.blogspot.com/2015/04/best-way-for-calling-method-of.html.