展示

"dialog" 元素允許以彈出視窗的方式顯示和隱藏控制元件。

對話方塊是一個帶有必填的@id 屬性的容器控制元件。它可以放置在 (X)HTML body 元素中的任何位置，考慮到它將被 XSLTForms 的 XSLT 步驟轉換為一個停用的（或隱藏的）DIV 元素。

對話方塊使用 z-index 屬性在模態彈出視窗中呈現，另一個 DIV 元素覆蓋所有主要元素，具有較低的 z-index 值，以停用與控制元件的互動。當在對話方塊中更改控制元件值時，所有其他控制元件都可以重新整理，無論它們是在此對話方塊中還是在其他地方。XSLTForms 尚未支援標籤，並且沒有 X 觸發器。

對話方塊可以巢狀。祖先對話方塊會自動遮蔽，更改覆蓋 DIV 的 z-index 屬性。

定義了兩個操作用於對話方塊管理

"show"：此操作將啟用由 @dialog 屬性值標識的對話方塊
"hide"：此操作將停用由 @dialog 屬性值標識的對話方塊

通常，對於每個對話方塊，至少應該有一個觸發器用於顯示（開啟）它，以及另一個觸發器用於隱藏（關閉）它。

示例程式

<html
 xmlns="http://www.w3.org/1999/xhtml"
 xmlns:xf="http://www.w3.org/2002/xforms"
 xmlns:ev="http://www.w3.org/2001/xml-events">
 <head>
  <title>Contact</title>
   <style type="text/css">
    #details {
     width: 250px;
     height: 100px;
    }
  </style>
  <xf:model>
   <xf:instance xmlns="">
    <contact>
     <email/>
     <firstname/>
     <lastname/>
    </contact>
   </xf:instance>
   <xf:bind ref="email" type="xf:email"/>
   <xf:setfocus ev:event="xforms-ready" control="email"/>
  </xf:model>
 </head>
 <body>
  <xf:dialog id="details">
   <xf:input id="firstname" ref="firstname">
    <xf:label>First Name : </xf:label>
   </xf:input>
   <br/>
   <xf:input ref="lastname">
    <xf:label>Last Name : </xf:label>
   </xf:input>
   <br/>
   <xf:trigger>
    <xf:label>Close</xf:label>
    <xf:action ev:event="DOMActivate">
     <xf:hide dialog="details"/>
     <xf:setfocus control="email"/>
    </xf:action>
   </xf:trigger>
  </xf:dialog>
  <xf:group>
   <xf:label>Contact Information</xf:label>
   <xf:input id="email" ref="email" incremental="true">
    <xf:label>E-mail : </xf:label>
   </xf:input>
   <xf:trigger>
    <xf:label>Details</xf:label>
    <xf:action ev:event="DOMActivate">
     <xf:show dialog="details"/>
     <xf:setfocus control="firstname"/>
    </xf:action>
   </xf:trigger>
  </xf:group>
 </body>
</html>

參考文獻

W3C XForms WG Wiki - XForms 1.2 的對話方塊候選規範
AJAXForms 附加元件 - 特定的對話方塊附加元件
Orbeon 對話方塊擴充套件