アダプティブフォームの JSON スキーマのデザイン(コアコンポーネント) creating-adaptive-forms-using-json-schema

バージョン
記事リンク
基盤
ここをクリックしてください
コアコンポーネント
この記事

前提条件 prerequisites

フォームモデルとして JSON スキーマを使用して、コアコンポーネントに基づくアダプティブフォームをオーサリングする場合、JSON スキーマの基本を理解している必要があります。 この記事を読む前に、以下のコンテンツを読んでおくことをお勧めします。

フォームモデルとしての JSON スキーマの使用 using-a-json-schema-as-form-model

Adobe Experience Manager Formsでは、既存の JSON スキーマをフォームモデルとして使用した、コアコンポーネントに基づくアダプティブフォームの作成がサポートされています。 JSON スキーマは、組織内のバックエンドシステムによってデータが作成または使用される構造を表します。使用する JSON スキーマは、v4 仕様に準拠している必要があります。

JSON スキーマの使用上の主な特長を以下に示します。

  • JSON の構造は、アダプティブフォームのオーサリングモードの「コンテンツファインダー」タブでツリーとして表示されます。JSON 階層からコアコンポーネントに基づくアダプティブフォームに要素をドラッグして追加できます。
  • 関連付けられたスキーマに準拠する JSON を使用して、フォームに事前入力できます。
  • ユーザーが入力したデータは、送信時には関連付けられたスキーマに適合する JSON として送信されます。
  • 2012-20 バージョンの仕様に従って、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",
              }
JSON の要素、プロパティ、属性
アダプティブフォームコンポーネント

enum および enumNames 制約を含む string プロパティ。

構文

{

"type" : "string",

"enum" : ["M", "F"]

"enumNames" : ["Male", "Female"]

}

ドロップダウンコンポーネント:

  • enumNames にリストされた値はドロップボックスに表示されます。
  • enum にリストされた値は計算に使用されます。

format 制約を含む string プロパティ。例えば、メール、日付など。

構文

{

"type" : "string",

"format" : "email"

}

  • type が string で format が email の場合、メールコンポーネントがマップされます。
  • type が string で format が hostname の場合、検証を含むテキストボックスコンポーネントがマップされます。

{

"type" : "string",

}

テキストフィールド
number プロパティ
サブタイプが float に設定された数値フィールド
integer プロパティ
サブタイプが integer に設定された数値フィールド
boolean プロパティ
切り替え
object プロパティ
パネル
array プロパティ
minItems および maxItems にそれぞれ等しい min および max を持つ繰り返し可能なパネル。同種の配列のみがサポートされます。そのため、項目制限は、配列でなくオブジェクトである必要があります。

共通のスキーマプロパティ common-schema-properties

アダプティブフォームは JSON スキーマで使用可能な情報を使用して、生成された各フィールドをマッピングします。具体的には、以下のようになります。

  • title プロパティは、アダプティブフォームコンポーネントのラベルとして機能します。
  • description プロパティは、アダプティブフォームコンポーネントの詳細な説明として設定されます。
  • default プロパティは、アダプティブフォームフィールドの初期値として機能します。
  • maxLength プロパティは、テキストフィールドコンポーネントの maxlength 属性として設定されます。
  • minimummaximumexclusiveMinimum および exclusiveMaximum プロパティは、数値ボックスコンポーネントに使用されます。
  • DatePicker component の範囲をサポートするために、追加の JSON スキーマプロパティ minDate および maxDate が用意されています。
  • minItems および maxItems プロパティは、パネルコンポーネントに追加または削除される可能性のある項目/フィールドの数を制限するために使用されます。
  • readOnly プロパティは、アダプティブフォームコンポーネントの readonly 属性を設定します。
  • required プロパティは、アダプティブフォームフィールドを必須としてマークします。一方、パネル(タイプがオブジェクト)の場合、最終的に送信された JSON データには、そのオブジェクトに対応する空の値を持つフィールドがあります。
  • pattern プロパティは、アダプティブフォームで検証パターン(正規表現)として設定されます。
  • JSON スキーマファイルの拡張子は、.schema.json を維持する必要があります。例えば、<filename>.schema.json のように指定します。

JSON スキーマのサンプル sample-json-schema

JSON スキーマ v4
code language-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",
  },
  "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 スキーマ 2012-20
code language-json
{
  "$schema": "https://json-schema.org/draft/2020-12/schema",
  "$id": "https://example.com/employee.schema.json",
  "$defs": {
    "employee": {
      "type": "object",
      "properties": {
        "userName": {
          "type": "string"
        },
        "dateOfBirth": {
          "type": "string",
          "format": "date"
        },
        "email": {
          "type": "string",
          "format": "email"
        },
        "language": {
          "type": "string"
        },
        "personalDetails": {
          "$ref": "#/$defs/personalDetails"
        },
        "projectDetails": {
          "$ref": "#/$defs/projectDetails"
        }
      },
      "required": [
        "userName",
        "dateOfBirth",
        "language"
      ]
    },
    "personalDetails": {
      "type": "object",
      "properties": {
        "GeneralDetails": {
          "$ref": "#/$defs/GeneralDetails"
        },
        "Family": {
          "$ref": "#/$defs/Family"
        },
        "Income": {
          "$ref": "#/$defs/Income"
        }
      }
    },
    "projectDetails": {
      "type": "array",
      "items": {
        "properties": {
          "name": {
            "type": "string"
          },
          "age": {
            "type": "number"
          },
          "projects": {
            "$ref": "#/$defs/projects"
          }
        }
      },
      "minItems": 1,
      "maxItems": 4
    },
    "projects": {
      "type": "array",
      "items": {
        "properties": {
          "name": {
            "type": "string"
          },
          "age": {
            "type": "number"
          },
          "projectsAdditional": {
            "$ref": "#/$defs/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",
        },
        "address": {
          "type": "string"
        }
      }
      }
  }
  }

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" }
  }
}

上記の例では、各顧客が出荷先と請求先の両方の住所を持つ顧客レコードを定義します。どちらの住所も構造(都道府県、市区町村、番地など)が同じ場合は、住所が重複しないようにすることをお勧めします。また、今後変更が行われたときに、簡単にフィールドを追加したり削除したりできます。

アダプティブフォームコンポーネントの許容値の制限 limit-acceptable-values-for-an-adaptive-form-component

JSON スキーマの要素に以下の制限を追加して、アダプティブフォームのコアコンポーネントで許容される値を制限できます。

スキーマプロパティ
データタイプ
説明
コンポーネント
maximum
文字列
数値および日付の上限を指定します。デフォルトでは、最大値が含まれます。
  • 数値ボックス
  • 数値ステッパー
  • 日付選択
minimum
文字列
数値および日付の下限を指定します。デフォルトでは、最小値が含まれます。
  • 数値ボックス
  • 数値ステッパー
  • 日付選択
exclusiveMaximum
ブール値

true の場合、フォームのコンポーネントで指定された数値または日付は、maximum プロパティに指定された数値または日付よりも小さい値である必要があります。

false の場合、フォームのコンポーネントで指定された数値または日付は、maximum プロパティに指定された数値または日付以下の値である必要があります。

  • 数値ボックス
  • 数値ステッパー
  • 日付選択
exclusiveMinimum
ブール値

true の場合、フォームのコンポーネントで指定された数値または日付は、minimum プロパティに指定された数値または日付よりも大きい値である必要があります。

false の場合、フォームのコンポーネントで指定された数値または日付は、minimum プロパティに指定された数値または日付以上の値である必要があります。

  • 数値ボックス
  • 数値ステッパー
  • 日付選択
minLength
文字列
コンポーネントで許可される最小文字数を指定します。最小の長さは 0 以上である必要があります。
  • テキストボックス
maxLength
文字列
コンポーネントで許可される最大文字数を指定します。最大の長さは 0 以上である必要があります。
  • テキストボックス
pattern
文字列

文字のシーケンスを指定します。文字が指定されたパターンに適合すると、コンポーネントはその文字を受け入れます。

この pattern プロパティは、対応するアダプティブフォームコンポーネントの検証パターンにマップされます。

  • XSD スキーマにマップされるすべてのアダプティブフォームコンポーネント
maxItems
文字列
配列の項目の最大数を指定します。項目の最大数は 0 以上である必要があります。
minItems
文字列
配列の項目の最小数を指定します。項目の最小数は 0 以上である必要があります。

スキーマ準拠データの有効化 enablig-schema-compliant-data

フォーム送信時にすべての JSON スキーマベースのアダプティブフォームでスキーマに準拠したデータを生成できるようにするには、次の手順に従います。

  1. https://server:host/system/console/configMgr で Experience Manager web コンソールに移動します。
  2. アダプティブフォームおよびインタラクティブ通信 web チャネルの設定 ​を見つけます。
  3. その設定を選択して編集モードで開きます。
  4. スキーマ準拠データを生成 ​チェックボックスをオンにします。
  5. 設定を保存します。

アダプティブフォームおよびインタラクティブ通信 web チャネルの設定

サポート対象外の構成 non-supported-constructs

アダプティブフォームは以下の JSON スキーマ構成をサポートしていません。

  • Null タイプ
  • any などの Union タイプ
  • OneOf、AnyOf、AllOf、NOT
  • 同種の配列のみがサポートされます。そのため、項目制限は、配列でなくオブジェクトである必要があります。
  • $ref での URI 参照

よくある質問 frequently-asked-questions

繰り返し可能なサブフォーム(minOccurs 値または maxOccurs 値が 1 より大きい)では、サブフォーム(任意の複合型から生成された構造)の個々の要素をドラッグできないのはなぜですか?

繰り返し可能なサブフォームでは、完全なサブフォームを使用する必要があります。選択した一部のフィールドのみを使用する場合は、構造全体を使用し、不要部分を削除します。

コンテンツファインダーに長く複雑な構造があります。特定の要素を見つけるにはどうすればよいですか?

以下の 2 つのオプションがあります。

  • ツリー構造をスクロールする
  • 検索ボックスを使用して、要素を検索する

JSON スキーマファイルの拡張子は何ですか。

JSON スキーマファイルの拡張子は、.schema.json にする必要があります。例えば、<filename>.schema.json のように指定します。

コアコンポーネントに基づ aem:afProperties たアダプティブFormsでは、JSON スキーマの一部としてサポートされますか?

いいえ。コアコンポーネントでは aem:afProperties はサポートされていません。 このプロパティは、基盤コンポーネントでのみサポートされます。

関連トピック see-also

recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab