為最適化表單設計 JSON 綱要 creating-adaptive-forms-using-json-schema
Adobe 建議使用新式且可擴充的資料擷取核心元件,用來建立新的最適化表單或將最適化表單新增到 AEM Sites 頁面。這些元件代表最適化表單建立方面的重大進步,可確保令人印象深刻的使用者體驗。本文會介紹使用基礎元件編寫最適化表單的舊方法。
先決條件 prerequisites
使用JSON結構描述作為自適應表單的表單模型編寫時,需要基本瞭解JSON結構描述。 建議您先閱讀下列內容,再閱讀本文。
使用JSON結構描述作為表單模型 using-a-json-schema-as-form-model
Adobe Experience Manager表單支援使用現有JSON結構描述作為表單模型來建立調適型表單。 此JSON結構描述代表組織中後端系統產生或使用資料的結構。 您使用的JSON結構描述應符合v4規格。
使用JSON結構描述的主要功能包括:
- JSON的結構在最適化表單的製作模式中,會以樹狀結構顯示在「內容尋找器」標籤中。 您可以從JSON階層拖曳元素並新增至最適化表單。
- 您可以使用與關聯結構描述相容的JSON預先填入表單。
- 在提交時,使用者輸入的資料會以JSON格式提交,且符合相關聯的結構描述。
- 您也可以根據2012-20 version的規格,以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."
}
}
通用結構描述屬性 common-schema-properties
最適化表單會使用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結構描述 sample-json-schema
code language-json |
---|
|
code language-json |
---|
|
從JSON結構描述V4到2020-12版本規範的主要變更為:
- ID宣告為
$id
- 定義宣告為
$defs
可重複使用的結構描述定義 reusable-schema-definitions
定義索引鍵是用來識別可重複使用的結構描述。 可重複使用的結構描述定義用於建立片段。 具有定義的範例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結構描述定義中預先設定欄位 pre-configuring-fields-in-json-schema-definition
您可以使用 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
}
限制最適化表單元件的可接受值 limit-acceptable-values-for-an-adaptive-form-component
您可以將下列限制新增至JSON結構元素,以限制最適化表單元件可接受的值:
啟用符合結構描述的資料 enablig-schema-compliant-data
若要讓所有JSON結構描述型最適化Forms在表單提交時產生結構描述相容的資料,請遵循下列步驟:
- 前往
https://server:host/system/console/configMgr
的Experience ManagerWeb主控台。 - 找到 最適化表單與互動式通訊Web通道組態。
- 選取以在編輯模式中開啟設定。
- 選取 產生符合結構描述的資料 核取方塊。
- 儲存設定。
不支援的建構 non-supported-constructs
最適化Forms不支援下列JSON結構描述:
- Null型別
- 等位型別,例如any和
- OneOf、AnyOf、AllOf及NOT
- 僅支援同質陣列。 因此,專案限制必須是物件,而不是陣列。
- $ref中的URI參考
常見問題 frequently-asked-questions
為什麼我無法為可重複的子表單(minOccours或maxOccurs值大於1)拖曳子表單的個別元素(由任何複雜型別產生的結構)?
在可重複的子表單中,您必須使用完整的子表單。 如果您只想使用選擇性欄位,請使用整個結構並刪除不需要的結構。
我在內容尋找器中有長而複雜的結構。 如何找到特定專案?
您有兩個選項:
- 捲動瀏覽樹狀結構
- 使用搜尋方塊來尋找元素
什麼應該是JSON結構描述檔案的副檔名?
JSON結構描述檔案的副檔名必須是.schema.json。 例如,<filename>.schema.json。
另請參閱 see-also
- 建立 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 最適化表單
- 在最適化表單中新增版本設定、評論和附註
- 比較最適化表單