Primefaces 对话框表单结构答案

【问题标题】：Primefaces Dialogs Form StructurePrimefaces 对话框表单结构
【发布时间】：2011-03-23 07:46:28
【问题描述】：

我在一个项目中使用 Primefaces，我看到 IE 与 chrome/firefox/safari 在模态 Primefaces 对话框窗口方面的结果不佳，我认为这与表单放置有关。在 IE 中，这些对话框不会出现，但我可以看到透明度。在 chrome/firefox 中，它们很好。以下情况的最佳做法是什么：

具有一种表单的列表项基本 xhtml 页面。这个页面有几个打开有自己的 ajax 提交的对话框的链接 (commandButton, commandLink) 事件。

对话框应该位于基本 xhtml 页面的表单内部还是外部？
对话框应该有自己的形式吗？

下图为：

<html>
    <ui:composition>
        <ui:define name="content">
            <h:form id="xyz">
                //main page content here, commandButtons, commandLinks...etc
            </h:form>
            <dc:zoomDialog/>
        </ui:define>
    </ui:composition>
</html>

<!-- zoomDialog maps to the below -->
<html>
<ui:component>
    <h:form id="dialogFrm"> 
        <p:dialog widgetVar="zoomDlg" modal="true" styleClass="dialog dialog2"
                draggable="false" resizable="false" showEffect="fade"
                hideEffect="fade">
            //dialog content here, commandButton, commanLink...etc
        </p:dialog>
    </h:form>
</ui:component>

【问题讨论】：

标签： primefaces

【解决方案1】：

我在您的示例代码中没有看到它，但前段时间我遇到了类似的问题。原因是：嵌套表单（与您描述的症状相同：所有浏览器都可以工作，IE 除外）。嵌套表单不是有效的 html。一些浏览器可以处理它。 IE 不能。

一个很好的测试是将整个html输出（浏览器源，而不是jsf源）放入W3C Html validator并分析结果。

在Primefaces showcase 中，h:form 元素始终位于p:dialog 内部。见this discussion。

【讨论】：

链接断开：primefaces.org/showcase/ui/dialogLogin.jsf?jfwid=71409