primefaces - Primefaces 对话框的正确构造

Question

我对 Primefaces 3 对话框的构造感到困惑。

我在 SO 中看到了具有这种模式的问题。表单在对话框之外。

<h:form>
  <p:dialog id="dialog" modal="true" widgetVar="dlg">
  </p:dialog>
</h:form>

但另一个问题有这个。

<p:dialog id="dialog" modal="true" widgetVar="dlg">
    <h:form>      
    </h:form>
</p:dialog>

Primefaces 展示 http://www.primefaces.org/showcase/ui/dialogLogin.jsf赞成后者。

如果有任何正当理由使用一个而不是另一个，我会感到困惑吗？

谢谢

Answer 1

您总是更好地使用地方<h:form>内<p:dialog像这样

<p:dialog id="dialog" modal="true" widgetVar="dlg">
    <h:form>      
    </h:form>
</p:dialog>

因为您的对话框内容可能会从您的页面中“取出”并附加到您的 DOM 树中的其他位置，因此如果您将对话框放置在某个表单中，它可能会导致您的对话框被重新定位到其他地方并导致您的所有按钮/停止工作的链接和其他元素(这是 SO 中一个非常常见的问题)

所以为了安全起见，你 <h:form>标签在您的 <p:dialog标签

另一个例子是当你使用 appendToBody="true" 时在对话框中:

if dialog is inside an h:form component and appendToBody is enabled, on the browser dialog would be outside of form and may cause unexpected results. In this case, nest a form inside a dialog.