Jsf Primefaces：如果关闭对话框，则使用modal=true禁用背景

我在我的对话框中使用了

modal=true

和

appendToBody=true

，它在Chrome和Firefox中运行良好，但在IE8中不起作用。对话框显示出来，但是如果我关闭对话框，背景仍然是蓝色的，因为

modal=true

，但是我必须使用它

这是我的代码：

  <ui:composition template="../templates/site.xhtml"
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:p="http://primefaces.org/ui"
    xmlns:sec="http://www.springframework.org/security/tags">

    <ui:define name="content">

        <h:form id="form">

            <p:commandButton value="Button" type="button" id="myButton"
                onclick="form:testDialog.show()" />



        <p:dialog id="testDialog" widgetVar="testDialog"
            header="My Test Dialog" modal="true" appendToBody="true">
            <h:form>

                <p:fieldset legend="Dialog">
                    <p:spacer height="30" />


                </p:fieldset>
            </h:form>
        </p:dialog>
        </h:form>
    </ui:define>
</ui:composition>

编辑：

问题是对话框的命名。ID和widgetVar不能具有相同的名称。

---

与

相关，此处有嵌套表单，这在HTML中是不允许的。尝试在按钮之后和对话框之前立即关闭第一家公司：

<h:form id="form">
  <p:commandButton value="Button" type="button" id="myButton"
      onclick="testDialog.show()"/>
</h:form>

<p:dialog id="testDialog" widgetVar="testDialog"
    header="My Test Dialog" modal="true" appendToBody="true">
  <h:form>
    <p:fieldset legend="Dialog">
      <p:spacer height="30" />
    </p:fieldset>
  </h:form>
</p:dialog>

---

我还将

表单：testDialog.show（）

更改为

testDialog.show（）

，您的公式似乎不起作用。

您在这里有嵌套表单，这在HTML中是不允许的。尝试在按钮之后和对话框之前立即关闭第一家公司：

<h:form id="form">
  <p:commandButton value="Button" type="button" id="myButton"
      onclick="testDialog.show()"/>
</h:form>

<p:dialog id="testDialog" widgetVar="testDialog"
    header="My Test Dialog" modal="true" appendToBody="true">
  <h:form>
    <p:fieldset legend="Dialog">
      <p:spacer height="30" />
    </p:fieldset>
  </h:form>
</p:dialog>

我还将

表单：testDialog.show（）

更改为

testDialog.show（）

，您的公式似乎不起作用。

您是否在模板文件中使用

当我混合使用布局和模式对话框时，总是会遇到问题

在我的父模板中，我通常使用

定义一个空间来放置模态对话框：

主模板：xhtml:

someXhtml.xhtml

呜呜呜呜
....

使用该选项，您将“手动附加”表单到主体，因此不需要将“附加到主体”设置为true。这使我可以在任何xhtml页面中插入表单，而不用担心布局中的模态表单。

您是否在模板文件中使用

当我混合使用布局和模式对话框时，总是会遇到问题

在我的父模板中，我通常使用

定义一个空间来放置模态对话框：

主模板：xhtml:

someXhtml.xhtml

呜呜呜呜
....

---

使用该选项，您将“手动附加”表单到主体，因此不需要将“附加到主体”设置为true。这使我能够在任何xhtml页面中插入表单，而不必担心布局中的模式表单。

现在该对话框在Google Chrome中没有显示，它在Firefox中工作得很好，在IE中显示了，但仍然存在一个问题，即一旦关闭，背景是不可点击的。您是否因为在这篇文章之外没有任何

表单
标签而感到难过？也许在你插入这部分代码的文件中？现在谷歌Chrome中没有显示该对话框，它在Firefox中工作得很好，IE中也显示了，但仍然存在一个问题，即一旦关闭，背景就不可点击。你对在这篇文章之外没有任何
表单
标记感到愤怒吗？也许在您插入这部分代码的文件中？正如partlov所说，在使用小部件变量时，您需要小心使用嵌套表单并删除
表单：
，正如partlov所说，在使用小部件变量时，您需要小心使用嵌套表单并删除
表单：
<ui:composition template="mainTemplate.xhtml">
    <ui:define name="content">
        bla bla bla
    </ui:define>

    <ui:define name="dialogs">
        <p:dialog modal="true" appendToBody="false">
            ....
        </p:dialog>
    </ui:define>
</ui:composition>