為最適化表單設計 JSON 綱要

Adobe 建議使用新式且可擴充的資料擷取核心元件，用來建立新的最適化表單或將最適化表單新增到 AEM Sites 頁面。這些元件代表最適化表單建立方面的重大進步，可確保令人印象深刻的使用者體驗。本文會介紹使用基礎元件編寫最適化表單的舊方法。

先決條件

使用JSON結構描述作為自適應表單的表單模型編寫時，需要基本瞭解JSON結構描述。 建議您先閱讀下列內容，再閱讀本文。

• 建立最適化表單
• JSON結構描述

使用JSON結構描述作為表單模型

Adobe Experience Manager表單支援使用現有JSON結構描述作為表單模型來建立調適型表單。 此JSON結構描述代表組織中後端系統產生或使用資料的結構。 您使用的JSON結構描述應符合 v4規格.

使用JSON結構描述的主要功能包括：

• JSON的結構在最適化表單的製作模式中，會以樹狀結構顯示在「內容尋找器」標籤中。 您可以從JSON階層拖曳元素並新增至最適化表單。
• 您可以使用與關聯結構描述相容的JSON預先填入表單。
• 在提交時，使用者輸入的資料會以JSON格式提交，且符合相關聯的結構描述。

JSON結構描述包含簡單和複雜的元素型別。 元素具有將規則新增至元素的屬性。 將這些元素和屬性拖曳至最適化表單時，會自動對應至對應的最適化表單元件。

JSON元素與最適化表單元件的對應如下：

"birthDate": {
              "type": "string",
              "format": "date",
              "pattern": "date{DD MMMM, YYYY}",
              "aem:affKeyword": [
                "DOB",
                "Date of Birth"
              ],
              "description": "Date of birth in DD MMMM, YYYY",
              "aem:afProperties": {
                "displayPictureClause": "date{DD MMMM, YYYY}",
                "displayPatternType": "date{DD MMMM, YYYY}",
                "validationPatternType": "date{DD MMMM, YYYY}",
                "validatePictureClause": "date{DD MMMM, YYYY}",
                "validatePictureClauseMessage": "Date must be in DD MMMM, YYYY format."
              }

通用結構描述屬性

最適化表單會使用JSON結構描述中可用的資訊來對應每個產生的欄位。 尤其是：

• 此 title 屬性可做為最適化表單元件的標籤。
• 此 description 屬性會設定為最適化表單元件的完整說明。
• 此 default 屬性會作為最適化表單欄位的初始值。
• 此 maxLength 屬性設為 maxlength 文字欄位元件的屬性。
• 此 minimum， maximum， exclusiveMinimum、和 exclusiveMaximum 屬性用於數值方塊元件。
• 若要支援範圍 DatePicker component 其他JSON結構屬性 minDate 和 maxDate 提供……
• 此 minItems 和 maxItems 屬性是用來限制可從面板元件新增或移除的專案/欄位數量。
• 此 readOnly 屬性會設定 readonly 最適化表單元件的屬性。
• 此 required 屬性會將調適型表單欄位標籤為必填欄位，但在面板（其中型別為物件）中，最終提交的JSON資料中會有欄位，其空值會對應至該物件。
• 此 pattern 屬性已設定為最適化表單中的驗證模式（規則運算式）。
• JSON結構描述檔案的副檔名必須保留為.schema.json。 例如， <filename>.schema.json。

範例JSON結構描述

以下是JSON結構描述的範例。

{
 "$schema": "https://json-schema.org/draft-04/schema#",
 "definitions": {
  "employee": {
   "type": "object",
   "properties": {
    "userName": {
     "type": "string"
    },
    "dateOfBirth": {
     "type": "string",
     "format": "date"
    },
    "email": {
     "type": "string",
     "format": "email"
    },
    "language": {
     "type": "string"
    },
    "personalDetails": {
     "$ref": "#/definitions/personalDetails"
    },
    "projectDetails": {
     "$ref": "#/definitions/projectDetails"
    }
   },
   "required": [
    "userName",
    "dateOfBirth",
    "language"
   ]
  },
  "personalDetails": {
   "type": "object",
   "properties": {
    "GeneralDetails": {
     "$ref": "#/definitions/GeneralDetails"
    },
    "Family": {
     "$ref": "#/definitions/Family"
    },
    "Income": {
     "$ref": "#/definitions/Income"
    }
   }
  },
  "projectDetails": {
   "type": "array",
   "items": {
    "properties": {
     "name": {
      "type": "string"
     },
     "age": {
      "type": "number"
     },
     "projects": {
      "$ref": "#/definitions/projects"
     }
    }
   },
   "minItems": 1,
   "maxItems": 4
  },
  "projects": {
   "type": "array",
   "items": {
    "properties": {
     "name": {
      "type": "string"
     },
     "age": {
      "type": "number"
     },
     "projectsAdditional": {
      "$ref": "#/definitions/projectsAdditional"
     }
    }
   },
   "minItems": 1,
   "maxItems": 4
  },
  "projectsAdditional": {
   "type": "array",
   "items": {
    "properties": {
     "Additional_name": {
      "type": "string"
     },
     "Additional_areacode": {
      "type": "number"
     }
    }
   },
   "minItems": 1,
   "maxItems": 4
  },
  "GeneralDetails": {
   "type": "object",
   "properties": {
    "age": {
     "type": "number"
    },
    "married": {
     "type": "boolean"
    },
    "phone": {
     "type": "number",
     "aem:afProperties": {
      "sling:resourceType": "/libs/fd/af/components/guidetelephone",
      "guideNodeClass": "guideTelephone"
     }
    },
    "address": {
     "type": "string"
    }
   }
  },
  "Family": {
   "type": "object",
   "properties": {
    "spouse": {
     "$ref": "#/definitions/spouse"
    },
    "kids": {
     "$ref": "#/definitions/kids"
    }
   }
  },
  "Income": {
   "type": "object",
   "properties": {
    "monthly": {
     "type": "number"
    },
    "yearly": {
     "type": "number"
    }
   }
  },
  "spouse": {
   "type": "object",
   "properties": {
    "name": {
     "type": "string"
    },
    "Income": {
     "$ref": "#/definitions/Income"
    }
   }
  },
  "kids": {
   "type": "array",
   "items": {
    "properties": {
     "name": {
      "type": "string"
     },
     "age": {
      "type": "number"
     }
    }
   },
   "minItems": 1,
   "maxItems": 4
  }
 },
 "type": "object",
 "properties": {
  "employee": {
   "$ref": "#/definitions/employee"
  }
 }
}

可重複使用的結構描述定義

定義索引鍵是用來識別可重複使用的結構描述。 可重複使用的結構描述定義用於建立片段。 具有定義的JSON結構描述範例如下：

{
  "$schema": "https://json-schema.org/draft-04/schema#",

  "definitions": {
    "address": {
      "type": "object",
      "properties": {
        "street_address": { "type": "string" },
        "city":           { "type": "string" },
        "state":          { "type": "string" }
      },
      "required": ["street_address", "city", "state"]
    }
  },

  "type": "object",

  "properties": {
    "billing_address": { "$ref": "#/definitions/address" },
    "shipping_address": { "$ref": "#/definitions/address" }
  }
}

上述範例會定義客戶記錄，其中每個客戶都有送貨和帳單地址。 兩個地址的結構相同（地址有街道地址、城市和州/省），因此最好不要重複這些地址。 它也會讓您日後在變更欄位時輕鬆新增和刪除欄位。

在JSON結構描述定義中預先設定欄位

您可以使用 aem：afProperties 屬性來預先設定JSON結構描述欄位，以對應至自訂最適化表單元件。 範例如下：

{
    "properties": {
        "sizeInMB": {
            "type": "integer",
            "minimum": 16,
            "maximum": 512,
            "aem:afProperties" : {
                 "sling:resourceType" : "/apps/fd/af/components/guideTextBox",
                 "guideNodeClass" : "guideTextBox"
             }
        }
    },
    "required": [ "sizeInMB" ],
    "additionalProperties": false
}

限制最適化表單元件的可接受值

您可以將下列限制新增至JSON結構元素，以限制最適化表單元件可接受的值：

啟用符合結構描述的資料

若要讓所有JSON結構描述型最適化Forms在表單提交時產生結構描述相容的資料，請遵循下列步驟：

1. 前往Experience Manager網頁主控台，位於 https://server:host/system/console/configMgr.
2. 尋找 最適化表單和互動式通訊Web通道設定.
3. 點選以在編輯模式中開啟設定。
4. 選取 產生符合結構描述的資料 核取方塊。
5. 儲存設定。

不支援的建構

最適化Forms不支援下列JSON結構描述：

• Null型別
• 等位型別，例如any和
• OneOf、AnyOf、AllOf及NOT
• 僅支援同質陣列。 因此，專案限制必須是物件，而不是陣列。

常見問題

我為何無法為可重複的子表單（minOccours或maxOccurs值大於1）拖曳子表單的個別元素（由任何複雜型別產生的結構）？

在可重複的子表單中，您必須使用完整的子表單。 如果您只想使用選擇性欄位，請使用整個結構並刪除不需要的結構。

我在內容尋找器中有個長而複雜的結構。 如何尋找特定元素？

您有兩個選項：

• 捲動瀏覽樹狀結構
• 使用搜尋方塊來尋找元素

JSON結構描述檔案的副檔名應該為何？

JSON結構描述檔案的副檔名必須是.schema.json。 例如， <filename>.schema.json。

另請參閱

• 建立 AEM 最適化表單
• 新增 AEM 最適化表單至 AEM Sites 頁面
• 將主題套用到 AEM 最適化表單
• 將元件新增至 AEM 最適化表單
• 在 AEM 最適化表單中使用驗證碼
• 產生 AEM 最適化表單的 PDF 版本 (DoR)
• 翻譯 AEM 最適化表單
• 啟用 Adobe Analytics 讓最適化表單可追蹤表單使用情況
• 將最適化表單連接到 Microsoft SharePoint
• 將最適化表單連接到 Microsoft Power Automate
• 將最適化表單連接到 Microsoft OneDrive
• 將最適化表單連接至 Microsoft® Azure Blob 儲存體
• 將最適化表單連接到 Salesforce
• 在 AEM 最適化表單中使用 Adobe Sign in
• 為最適化表單新增地區設定
• 將最適化表單資料傳送到資料庫
• 將最適化表單資料傳送到 REST 端點
• 將最適化表單資料傳送到 AEM 工作流程
• 使用 Forms 入口網站在 AEM 網站上列出 AEM 最適化 Forms