当对话框中的操作失败时，Primefaces 对话框背景不透明度加倍答案

【问题标题】：Primefaces dialog background opacity doubles when action fails in dialog当对话框中的操作失败时，Primefaces 对话框背景不透明度加倍
【发布时间】：2012-02-22 08:52:43
【问题描述】：

我有一个页面模式对话框，如果用户单击编辑按钮，就会呈现该对话框。该对话框要求输入用户名和密码，并有一个提交按钮。如果用户名和密码无效，则会显示错误。

问题是如果用户名和密码不认证，每次认证失败时模态背景越来越暗。

是什么原因造成的？

<p:dialog id="dialog" header="Login To Edit" widgetVar="dialog" visible="#{fundingBacker.loginVisible}" modal="true" 
    resizable="false" closable="false" draggable="true" rendered="#{!userBean.loggedIn}">
    <h:form>

        <p:ajaxStatus style="width:16px;height:16px;">
            <f:facet name="start">
                <p:graphicImage value="../images/loading4.gif" />
            </f:facet>
            <f:facet name="complete">
                <h:outputText value="" />
            </f:facet>
        </p:ajaxStatus>

        <p:messages autoUpdate="true" showDetail="true" />

        <h:panelGrid columns="2" cellpadding="5">

            <h:outputLabel for="lanId" value="LanID:" />
            <p:inputText value="#{currentUser.lanID}" id="lanId" required="true" label="lanId" requiredMessage="Lan ID is required" />

            <h:outputLabel for="password" value="Password:" />
            <p:password value="#{currentUser.password}" id="password" required="true" label="password" feedback="false" requiredMessage="Password is required" />

            <p:commandButton id="loginButton" value="Login" type="submit" styleClass="primaryButton" action="#{currentUser.performLogin}" update="dialog"/>

        </h:panelGrid>
    </h:form>
</p:dialog>

【问题讨论】：

标签： java jsf dialog primefaces opacity

【解决方案1】：

每次向服务器发出请求后，您的对话框都会被复制。尝试设置对话框属性appendToBody="true"，这应该可以防止这种情况发生。

【讨论】：

我添加了它，但没有任何不同。

【解决方案2】：

您每次都在更新对话框而不先关闭它。我不确定这是错误还是功能，但由于visible 属性，每次对话框更新时都会重新初始化覆盖。您可能希望将其与更紧凑的测试用例一起报告给 PrimeFaces 人员。

最简单的解决方案是在 ajax 成功时关闭对话框。它会以比最终用户眨眼的速度更快地重新显示。

<p:commandButton ... onsuccess="dialog.hide()" update="dialog" />

您可能只需要微调 visible 和 rendered 属性，以确保在验证失败时（例如，当用户仍未登录时）重新打开对话框。

另一种方法是更新对话框的表单而不是对话框本身。

<p:commandButton ... update="@form" />

或者完全删除该属性。它已经默认为@form。

<p:commandButton ... />

然后可以通过RequestContext#execute()关闭成功登录对话框。

RequestContext.getCurrentInstance().execute("dialog.hide()");

【讨论】：

【解决方案3】：

这是 3.1.Final 中修复的错误；

http://code.google.com/p/primefaces/issues/detail?id=3426

【讨论】：