PrimeFaces dialog not working in Chrome browser

问题

As you can see I am trying to display a dialog box on click on the command link, the dialog is displayed in IE and Firefox, but not in Google Chrome v23, please suggest.

<h:form id="myForm">
    <p:tabView id="tabView">
        <p:tab id="tab1" title="Tab 1">
            <h:panelGrid columns="1" cellpadding="10">
                <h:dataTable value="#{testBean.dataList}" var="data">
                    <h:column>
                        <h:outputText value="#{data}" />
                    </h:column>
                    <h:column>
                        <p:commandLink action="#{testBean.loadCommentHistory(data)}"
                                       update=":myForm:tabView:dialog" oncomplete="dlg.show()">
                            <h:graphicImage url="resources/theme1/images/comments.gif"
                                            styleClass="basicImageStyle" />
                        </p:commandLink>
                    </h:column>
                </h:dataTable>
                <p:dialog id="dialog" header="Dynamic Dialog" widgetVar="dlg">
                    <h:outputText value="#{testBean.commentHistory}" />
                </p:dialog>
            </h:panelGrid>
        </p:tab>
    </p:tabView>
</h:form>

回答1:

When you update the dialog the dialog is reset to the default state which is hidden. If you call dialog.show() and update the dialog the dialog is hidden again. Chrome (being probably faster than IE or FireFox) seems to handle this differently. A solution would be to wrap the content of the dialog in a container and update the container.

<p:commandLink action="#{testBean.loadCommentHistory(data)}"
    update=":myForm:tabView:dialog-content" oncomplete="dlg.show()">
    <h:graphicImage url="resources/theme1/images/comments.gif"
        styleClass="basicImageStyle" />
</p:commandLink>

<p:dialog id="dialog" header="Dynamic Dialog" widgetVar="dlg">
    <p:outputPanel id="dialog-content">
        <h:outputText value="#{testBean.commentHistory}" />
    </p:outputPanel>
</p:dialog>

回答2:

Try to encapsulate the page in a f:view tag if you haven't already. There is some problem when it is not present with Chrome and Safari. See http://primefaces.org/faq.html question 3

<html xmnls=... >
    <f:view contentType="text/html">
        <h:head>
            ....
        </h:head>
        <h:body>
            ....
        </h:body>
    </f:view>
</html>

来源：https://stackoverflow.com/questions/13839894/primefaces-dialog-not-working-in-chrome-browser

标签

jsf-2

primefaces