Créer un schéma JSON pour un formulaire adaptatif creating-adaptive-forms-using-json-schema
Adobe recommande d’utiliser la capture de données moderne et extensible. Composants principauxpour création d’un Forms adaptatifou Ajout de Forms adaptatif à des pages AEM Sites. Ces composants représentent une avancée significative dans la création de Forms adaptatif, ce qui garantit des expériences utilisateur impressionnantes. Cet article décrit l’approche plus ancienne de la création de Forms adaptatif à l’aide de composants de base.
Conditions préalables prerequisites
La création d’un formulaire adaptatif à l’aide d’un schéma JSON en tant que modèle de formulaire requiert des connaissances de base en matière de schémas JSON. Il est recommandé de lire le contenu suivant avant cet article.
Utilisation d’un schéma JSON comme modèle de formulaire using-a-json-schema-as-form-model
Adobe Experience Manager Forms prend en charge la création d’un formulaire adaptatif en utilisant un schéma JSON existant en tant que modèle de formulaire. Ce schéma JSON représente la structure dans laquelle les données sont générées ou utilisées par le système back-end de votre organisation. Le schéma JSON que vous utilisez doit être compatible avec les spécifications v4.
Les fonctionnalités clés de l’utilisation d’un schéma JSON sont les suivantes :
- La structure du modèle JSON s’affiche sous forme d’arborescence sous l’onglet Outil de recherche de contenu en mode création pour un formulaire adaptatif. Vous pouvez faire glisser et ajouter un élément de la hiérarchie JSON dans le formulaire adaptatif.
- Vous pouvez préremplir le formulaire à l’aide de JSON conforme au schéma associé.
- Lors de l’envoi, les données saisies par l’utilisateur sont envoyées au format JSON en phase avec le schéma associé.
Un schéma JSON se compose de types d’éléments simples et complexes. Les éléments possèdent des attributs qui ajoutent des règles à ceux-ci. Lorsque ces éléments et attributs sont déplacés vers un formulaire adaptatif, ils sont automatiquement mis en correspondance avec les composants de formulaires adaptatifs correspondants.
Cette mise en correspondance des éléments JSON avec les composants de formulaires adaptatifs est la suivante :
"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."
}
Propriétés communes de schéma common-schema-properties
Le formulaire adaptatif utilise les informations disponibles dans le schéma JSON pour mapper chaque champ généré. En particulier :
- La propriété
title
sert de libellé aux composants de formulaire adaptatif. - La propriété
description
est définie comme description longue pour un composant de formulaire adaptatif. - La propriété
default
sert de valeur initiale d’un champ de formulaire adaptatif. - La propriété
maxLength
est définie en tant qu’attributmaxlength
du composant champ de texte. - Les propriétés
minimum
,maximum
,exclusiveMinimum
etexclusiveMaximum
sont utilisées pour le composant zone numérique. - Pour prendre en charge la plage de composants
DatePicker component
, les propriétés supplémentairesminDate
etmaxDate
de schéma JSON sont fournis. - Les propriétés
minItems
etmaxItems
servent à limiter le nombre d’éléments/champs qui peuvent être ajoutés ou retirés d’un composant de panneau. - La propriété
readOnly
définit l’attributreadonly
d’un composant de formulaire adaptatif. - La propriété
required
marque le champ de formulaire adaptatif comme obligatoire alors qu’en cas de panneau (lorsque le type est objet), les données JSON finales soumises ont des champs avec une valeur vide correspondant à cet objet. - La propriété
pattern
est définie comme modèle de validation (expression régulière) sous forme adaptative. - L’extension du fichier de schéma JSON doit être conservée dans .schema.json. Par exemple, <nom_fichier>.schema.json.
Exemple de schéma JSON sample-json-schema
Vous trouverez ci-dessous un exemple de schéma 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"
}
}
}
Définitions de schéma réutilisables reusable-schema-definitions
Les clés de définition sont utilisées pour identifier les schémas réutilisables. Les définitions de schéma réutilisables sont utilisées pour créer des fragments. Un exemple de schéma JSON dont la définition est fournie ci-dessous :
{
"$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" }
}
}
L’exemple ci-dessus définit un enregistrement de client, où chaque client possède à la fois une adresse de livraison et une adresse de facturation. La structure des deux adresses est la même (les adresses ont une adresse de rue, une ville et un état), il est donc préférable de ne pas dupliquer les adresses. Cela facilite également l’ajout et la suppression de champs pour toute modification ultérieure.
Préconfiguration des champs dans la définition du schéma JSON pre-configuring-fields-in-json-schema-definition
Vous pouvez utiliser la propriété aem:afProperties pour préconfigurer le champ de schéma JSON et le faire correspondre à un composant de formulaire adaptatif personnalisé. Un exemple est répertorié ci-dessous :
{
"properties": {
"sizeInMB": {
"type": "integer",
"minimum": 16,
"maximum": 512,
"aem:afProperties" : {
"sling:resourceType" : "/apps/fd/af/components/guideTextBox",
"guideNodeClass" : "guideTextBox"
}
}
},
"required": [ "sizeInMB" ],
"additionalProperties": false
}
Limite des valeurs possibles pour un composant de formulaire adaptatif limit-acceptable-values-for-an-adaptive-form-component
Vous pouvez ajouter les restrictions suivantes aux éléments de schéma JSON pour limiter les valeurs possibles pour un composant de formulaire adaptatif :
Activation des données conformes aux schémas enablig-schema-compliant-data
Pour permettre à tous les Forms adaptatifs basés sur un schéma JSON de générer des données conformes au schéma lors de l’envoi du formulaire, procédez comme suit :
- Accédez à la console web Experience Manager à l’adresse
https://server:host/system/console/configMgr
. - Localiser Configuration de canal web de formulaire adaptatif et de communication interactive.
- Sélectionnez cette option pour ouvrir la configuration en mode d’édition.
- Sélectionnez la variable Générer des données conformes aux schémas .
- Enregistrez les paramètres.
Éléments non pris en charge non-supported-constructs
Les formulaires adaptatifs ne prennent pas en charge les éléments suivants de schéma JSON :
- Type null
- Types d’unions, tels que les types appropriés, et
- OneOf, AnyOf, AllOf et NOT
- Seuls les tableaux homogènes sont pris en charge. Par conséquent, la contrainte d’éléments doit être un objet et non un tableau.
Questions fréquemment posées frequently-asked-questions
Pourquoi est-ce que je ne parviens pas à faire glisser des éléments individuels d’un sous-formulaire (structure générée à partir de n’importe quel type complexe) pour les sous-formulaires répétables (les valeurs minOccurs ou maxOccurs sont supérieures à 1) ?
Dans un sous-formulaire répétable, vous devez utiliser le sous-formulaire complet. Si vous souhaitez uniquement des champs sélectifs, utilisez la structure entière et supprimez les champs indésirables.
Je dispose d’une longue structure complexe dans l’outil de recherche de contenu. Comment puis-je trouver un élément spécifique ?
Vous disposez de deux options :
- Parcourez la structure de l’arborescence.
- Utilisez la zone Rechercher pour rechercher un élément.
Quelle doit être l’extension d’un fichier de schéma JSON ?
L’extension d’un fichier de schéma JSON doit être .schema.json, Par exemple, <nom_fichier>.schema.json.
Voir également see-also
- Créer un formulaire adaptatif AEM
- Ajouter un formulaire adaptatif AEM à une page AEM Sites
- Appliquer des thèmes à un formulaire adaptatif AEM
- Ajouter des composants à un formulaire adaptatif AEM
- Utiliser reCAPTCHA dans un formulaire adaptatif AEM
- Générer une version PDF (document d’enregistrement) d’un formulaire adaptatif AEM
- Traduire un formulaire adaptatif AEM
- Activer Adobe Analytics sur un formulaire adaptatif pour suivre son utilisation
- Connecter un formulaire adaptatif à Microsoft SharePoint
- Connecter un formulaire adaptatif à Microsoft Power Automate
- Connecter un formulaire adaptatif à Microsoft OneDrive
- Connecter un formulaire adaptatif au stockage Blob Azure Microsoft
- Connecter un formulaire adaptatif à Salesforce
- Utiliser Adobe Sign dans un formulaire adaptatif AEM
- Ajouter un nouveau paramètre régional pour un formulaire adaptatif
- Envoyer des données de formulaire adaptatif à une base de données
- Envoyer des données de formulaire adaptatif à un point d’entrée REST
- Envoyer des données de formulaire adaptatif à un workflow AEM
- Utiliser le Portail Formulaires pour répertorier des formulaires adaptatifs AEM sur un site web AEM