Multiple p:dialog in one xhtml document supported?

[rubin]

Hi all,

I'm quite new to PrimeFaces. I've successfully created a xhtml page with a datatable, two dialogs (add, edit) and one confirmDialog (delete). the page renders without errors, and shows the expected data; add/edit/delete work also (but wait).

However, I noticed something strange: In my edit dialog I'm presuming a singleSelection to exist (which gets activated when someone clicks on an entry in the datatable). When I open the add*dialog without having a singleSelection and try to actually add something, an error occurs, telling me that singleSelection = null.

The part that is confusing to me is that singleSelection is only used in the edit dialog, and not in the add dialog so my assumption was that that should be ok, however, apparently, the edit dialog gets parsed regardless of the fact that it is opened or not (ie. open add dialog, try to add something, get error about singleSelection being null even though singleSelection is only used within the edit dialog).

Example:

Code: Select all

    <p:panel ...>

        <p:dataTable 
            <p:column ... </p:column>
        </p:dataTable>

        <b:panelButtons name="footer">
            <p:commandButton id="addButton" oncomplete="PF('addDialog').show()" ... />
            <p:commandButton id="editButton" oncomplete="PF('editDialog').show()" ... />
        </b:panelButtons>
    </p:panel>

    <p:dialog id="addDialog" widgetVar="addDialog" header="Add customer property" modal="true" dynamic="true" closeOnEscape="true" resizable="false" onShow="PF('addDialog').initPosition();">

        <h:panelGrid id="addDialogPanel">
            <p:outputLabel for="addPropertyKey" value="Foo: " />
            <p:inputText id="addPropertyKey" value="#{customerPropertyController.foo}" />
        </h:panelGrid>
        
        <b:panelButtons>
            <p:commandButton id="saveAddCustomerProperty" value="Save" action="#{customerPropertyController.addSingleSelection}" update=":messages,customerPropertyTable" onclick="hideDialog(PF('addDialog'));" />
            <p:commandButton id="cancelAddCustomerProperty" value="Cancel" action="#{customerPropertyController.resetSingleSelection}" onclick="hideDialog(PF('addDialog'))" />
        </b:panelButtons>
    </p:dialog>

    <p:dialog id="editDialog" widgetVar="editDialog" header="Edit customer property" modal="true" dynamic="true" closeOnEscape="true" resizable="false" onShow="PF('editDialog').initPosition();">

        <h:panelGrid id="editDialogPanel">
            <p:outputLabel for="editPropertyKey" value="Foo: " />
            <p:inputText id="editPropertyKey" value="#{customerPropertyController.singleSelection.foo}" />
        </h:panelGrid>

        <b:panelButtons>
            <p:commandButton id="saveEditCustomerProperty" value="Save" disabled="#{!customerPropertyController.hasSingleSelection}" action="#{customerPropertyController.updateSingleSelection}" update=":messages,customerPropertyTable" onclick="hideDialog(PF('editDialog'));" />
            <p:commandButton id="cancelEditCustomerProperty" value="Cancel" action="#{customerPropertyController.resetSingleSelection}" onclick="hideDialog(PF('editDialog'))" />
        </b:panelButtons>
    </p:dialog>

I'm probably doing something obviously wrong with regards to what one should and should not do with multiple dialogs on single pages. Any pointers greatly appreciated!

Kind regards,

Rubin!

[rossd]

All the dialogs are part of the page, all the time. So you can get confusing validation messages.

Try building the p:dialogs so that the fields are only rendered when required. Also make the p:dialogs have their own forms, rather than being part of the main form for the page.

Use the appendTo"@(body") so they are added at the bottom of the rendered page.

Ross.

[kukeltje]

read this before using appendTo: http://stackoverflow.com/questions/3020 ... useful-for