0

我正在使用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 不能同名。与此帖相关

4

2 回答 2

3

你<p:layout>在你的模板文件中使用吗？

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

在我的父模板中，我通常使用以下方式定义一个空间来放置我的模式对话框<ui:insert>：

主模板：xhtml：

<h:body>
    <p:layout>
        <p:layoutUnit position="cemter">
            <ui:insert name="content"/>
        </p:layoutUnit>
    <p:layout>

    <ui:insert name="dialogs"/>
</h:body>

someXhtml.xhtml

<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>

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

于 2013-02-05T10:05:35.053 回答
1

您在这里有嵌套的表单，这在 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>

我也改成form:testDialog.show()，testDialog.show()你的表述似乎不起作用。

于 2013-02-05T09:52:45.573 回答