Show Menu
主題×

製作最適化表單簡介

概覽

最適化表單可讓您建立引人入勝、互動式、動態且適應性強的表單。 AEM Forms提供直覺式使用者介面和立即可用的元件,以建立和使用最適化表單。 您可以選擇基於表單模型或模式或不使用表單模型建立自適應表單。 務必謹慎選擇不僅符合您要求,而且還能擴展您現有的基礎設施投資和資產的表單模型。 您可以從下列選項中選擇以建立最適化表單:
  • 使用表單資料模型 資料整合 ,可讓您將來自不同資料來源的實體和服務整合到表單資料模型中,以便用來建立可調式表單。 如果要建立的自適應表單涉及從多個資料源中讀取和寫入資料,請選擇表單資料模型。
  • 使用XDP表單範本 ​如果您對XFA或XDP表單有投資,這是理想的表單模型。 它提供將XFA型表單轉換為最適化表單的直接方式。 任何現有的XFA規則都會保留在相關的最適化表單中。 產生的最適化表單支援XFA結構,例如驗證、事件、屬性和模式。
  • 使用XML結構描述定義(XSD)或JSON結構描述 XML和JSON結構描述您組織中後端系統產生或使用資料的結構。 您可以將架構與最適化表單建立關聯,並使用其元素將動態內容新增至最適化表單。 在製作最適化表單時,架構的元素將可用於內容瀏覽器的「資料模型物件」索引標籤中。
  • 使用無或沒有表單模型
使用此選項建立的最適化表單不會使用任何表單模型。 從這種表單中生成的資料XML具有平坦的結構,具有欄位和相應的值。
有關建立自適應表單的詳細資訊,請參 閱建立自適應表單

最適化表單製作UI

針對製作最適化表單的觸控最佳化UI是直覺式的,並提供:
  • 拖放功能
  • 標準表單元件
  • 資產的整合儲存庫
當您建立新表格或編輯現有的最適化表格時,請使用下列UI元素:
答: 欄B. 頁面工具 欄C. Adaptive表單頁面

頁面工具列

頂端的頁面工具列提供多種選項,可讓您預覽表單、變更表單屬性及編輯表單版面。 您可以在製作表單時預覽表單,並依此進行變更。 在頁面工具列中,您會看到:
  • 切換側面板 (Toggle Side Panel 切換側面板(Toggle-side-panel): 可讓您顯示或隱藏側欄。
  • 頁面資訊 : 可讓您檢視頁面屬性、發佈/取消發佈表單、啟動表單工作流程,以及在傳統UI中開啟表單。
  • 模擬器 尺標 : 可讓您模擬不同顯示尺寸(例如平板電腦和手機)的表格外觀。
  • 編輯 : 可讓您選取其他模式,例如: 編輯、樣式、開發人員 ​和設計​
    • 編輯 : 可讓您編輯表單及其元件的屬性。 例如,新增元件、拖放影像,以及指定必填欄位。
    • 樣式 : 可讓您設定表單元件外觀的樣式。 例如,在樣式模式中,您可以選取面板並指定其背景顏色。
    • 開發人員 : 讓開發人員:
      • 探索表單的組成。
      • 除錯發生在何處和何時的項目,進而有助於解決問題。
    • 設計 : 可讓您啟用或停用未列在側欄中的自訂元件或現成可用的元件。
  • 預覽 : 可讓您預覽發佈表單時的表單外觀。

元件工具列

當您選取元件時,會看到工具列,可讓您使用它。 您可以選擇剪下、貼上、移動和指定元件屬性。 您的選項包括:
A. Configure : 點選「設 」時,元件屬性會顯示在側欄中。 設定這些屬性可讓您自訂資料擷取體驗。 您可以變更元件的元素名稱,在元件的「標題」欄位中指定標籤文字。 元素名稱可讓您擷取使用者使用元件所輸入的值。 在元件屬性中,您可以指定元件的行為,並管理使用者輸入。 在側欄中設定屬性,以擷取使用者資料並用於進一步處理。 最適化表單容器的屬性可讓您指定用戶端程式庫、版面、主題、記錄檔案設定、儲存設定、提交設定和中繼資料設定。
B. Copy : 您可以使用複製選項來複製元件,並將其貼到表單的其他位置。 貼上元件時,貼上的元件會獲取新的元素名稱,但保留複製的元件的屬性。
C. Cut : 可使用剪切選項在自適應形式中將元件從一個位置移動到另一個位置。
D. 刪除 : 可讓您從表單中刪除元件。
E. 插入 : 可讓您在選取的元件上方插入元件。
F. 貼上 : 可讓您使用上述選項貼上您剪下或複製的元件。
G. 編輯規則 : 可讓您開啟規則編輯器。 如需詳細資訊,請參 閱規則編輯器
H. 群組 : 如果想要剪下、複製或貼上多個元件,可讓您選取多個元件。
I. 父級 : 可讓您選取元件的父項。 例如,文字欄位位於子區段內,而子區段位於區段內。 區段位於參考根面板中,而最適化表單容器是參考根面板的父項。 對於元件,您可以看到所有選項以及從底部向上排序的層次結構。
例如,如果您點選「父 」以取得文字方塊,您可以看到:
  • 子區段
  • 章節
  • guideRootPanel
  • 最適化表單容器
J. 其他 : 提供更多選項以使用所選元件。
  • 檢視SOM運算式
  • 將面板儲存為片段(僅限面板)
  • 新增子面板(僅限面板)
  • 新增面板工具列(僅限面板)
  • 取代(不適用於面板)

Adaptive form page

最適化表單頁面是實際表單。 它和任何其他WCM頁面一樣,都是以WCM元件為模 cq:Page 型。 下圖顯示典型自適應表單的內容結構。
內容結構通常包含下列主要元件:
  • guideContainer : 最適化表單的根,在最適化表單UI中標 示為最適化表單 「開始」。 在此元件中,您可以指定:
    • 最適化表單的行動版面 : 定義行動裝置上表單的外觀。
    • 感謝頁面 : 定義在提交表單後重新導向使用者的頁面。
    • 提交動作 : 定義在使用者提交表單後,如何在伺服器上處理表單。
    • 樣式 : 指定用於自訂表單外觀的CSS檔案路徑。
  • rootPanel : 最適化表單的根面板。 它可在項目節點下包含子面板。 每個包含根面板的面板都可以有與其相關聯的版面。 面板的版面配置決定了表單的排版方式。 例如,在Accordion版面配置*中,*其項目會排列為Accordion步驟。
  • 工具欄 : 最適化表單容器具有關聯的全域工具列,該工具列是表單的全域工具列。 此工具列可使用編輯列中的 Add Toolbar (新增工具列)動作來新增,這可讓作者新增動作,例如「提交」、「儲存」、「重設」等。
  • 資產 : 此節點包含用於表單製作的其他資訊。 例如,表單模型詳細資訊、本地化詳細資訊等)。