CODEWITHSUNDEEP
javascriptjsfjsf-2primefaces
Cold
Cold

Reputation: 797

Open Dialog Box on Primefaces Error

I'm having a error when i try to open dialog box on Primefaces, and i can't understand why this is happening.

Here my page code:

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">
    <body>

        <ui:composition template="./template/template.xhtml">
            <ui:define name="content">
                <p:commandButton value="Abrir" oncomplete="w_dlgTeste.show()"/>
                <p:confirmDialog header="Erro desnecessário." message="Não estou a entender nada." widgetVar="w_dlgTeste" />
            </ui:define>
        </ui:composition>

    </body>
</html>

On google chrome Javascript console i see this:

enter image description here

Upvotes: 1

Views: 886

Answers (1)

mrganser
mrganser

Reputation: 1113

Try with onclick="PF('w_dlgTeste').show()". The error that appear there is because in Primefaces 4.0 and newer, the widgets are stored in a javascript widget array and you must call PF('w_dlgTeste') to return it from the array.

Apart from that, you can have a confirmDialog without content inside but it doesn't make any sense since you can't confirm anything. You should add confirmation buttons too.

If you want the simplest way, you can do it with only javascript:

<p:commandButton onclick="return confirm('Are you sure?')" .../>

Edit:

If what you want to do is to show a dialog confirmation, the best way you should do it is like this:

Using p:confirm in each button that you want a dialog confirmation:

<p:commandButton value="Abrir">
    <p:confirm header="Erro desnecessário." message="Não estou a entender nada." />
</p:commandButton>

And put the dialog with global="true" on your template because you probably want to reuse it:

<p:confirmDialog global="true">
    <p:commandButton value="Yes" type="button" styleClass="ui-confirmdialog-yes" icon="ui-icon-check" />
    <p:commandButton value="No" type="button" styleClass="ui-confirmdialog-no" icon="ui-icon-close" />
</p:confirmDialog>

Another option would be if what you want is just a simple information dialog after the action of the button you can do it like this too:

<p:commandButton value="Abrir" oncomplete="PF('w_dlgTeste').show()"/>
<p:dialog header="Erro desnecessário." widgetVar="w_dlgTeste">
    Não estou a entender nada.
</p:dialog>

Upvotes: 1

Related Questions