rishi
rishi

Reputation: 1842

Dialog element of primefaces not working

I am trying to use dialog element of primefaces but it is not working. so I have tried the same code provided in primefaces site. but that code is also not working.

            <h:panelGrid columns="1" cellpadding="5">
                <p:commandButton id="basic" value="Basic" onclick="PF('dlg1').show();" type="button" />

                <p:commandButton id="modalDialogButton" value="Modal" onclick="PF('dlg2').show();" type="button"/>

                <p:commandButton id="effectsDialogButton" value="Effects" onclick="PF('dlg3').show();" type="button" />
                </h:panelGrid>

                 <p:dialog id="basicDialog" header="Basic Dialog" widgetVar="dlg1" appendToBody="false">
                 <h:outputText value="Resistance to PrimeFaces is futile!" />
                    </p:dialog>

                    <p:dialog id="modalDialog" header="Modal Dialog" widgetVar="dlg2" modal="true" height="100" appendToBody="false">
                        <h:outputText value="This is a Modal Dialog." />
                    </p:dialog>

                    <p:dialog header="Effects" widgetVar="dlg3" showEffect="explode" hideEffect="bounce" height="100" appendToBody="false">
                        <h:outputText value="This dialog has nice effects." />
                    </p:dialog>

This is the header of my page:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
         "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
   <html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:h="http://java.sun.com/jsf/html"
  xmlns:f="http://java.sun.com/jsf/core"
  xmlns:p="http://primefaces.org/ui">

Upvotes: 1

Views: 10338

Answers (2)

Stojan Končar
Stojan Končar

Reputation: 131

p:commandButton need to be inside h:form

Upvotes: 3

Kuba
Kuba

Reputation: 2089

Try opening your dialog like so:

<p:dialog id="modalDialog" header="Modal Dialog" widgetVar="dlg2" modal="true" height="100" appendToBody="false">
           <h:outputText value="This is a Modal Dialog." />
</p:dialog>

<p:commandButton id="modalDialogButton" value="Modal" onclick="dlg2.show();" type="button" process="@this" update="@none"/>

Please post the header of your xhtml file and state what version of PrimeFaces you are using.

The following call:

PF('dlg2').show(); 

does not work with Primefaces v3.5 it works 4.0 and up. Version 4.0 supports

dlg2.show();

and

dlg2.hide();

but not for long, it will be deprecated in future versions so use PF('dlg2').show();

Upvotes: 7

Related Questions