JSON-schema ontwerpen voor een adaptief formulier creating-adaptive-forms-using-json-schema

Versie
Artikelkoppeling
Kernonderdelen
klik hier
Stichting
Dit artikel

de Adobe adviseert gebruikend de moderne en verlengbare gegevens vangen Componenten van de Kernvoor het creëren van nieuwe Aangepaste Formsof het toevoegen van Aangepaste Forms aan de pagina's van AEM Sites. Deze componenten betekenen een aanzienlijke vooruitgang in de aanmaak van Adaptive Forms en zorgen voor indrukwekkende gebruikerservaring. In dit artikel wordt een oudere aanpak beschreven voor de auteur Adaptive Forms die gebruikmaakt van stichtingscomponenten.

Versie
Artikelkoppeling
AEM 6,5
klik hier
AEM as a Cloud Service
Dit artikel

Vereisten prerequisites

Voor het ontwerpen van een adaptief formulier met behulp van een JSON-schema als formuliermodel is basiskennis van het JSON-schema vereist. Het wordt aanbevolen de volgende inhoud vóór dit artikel te lezen.

Een JSON-schema gebruiken als formuliermodel using-a-json-schema-as-form-model

Adobe Experience Manager Forms ondersteunt het maken van een adaptief formulier met een bestaand JSON-schema als formuliermodel. Dit JSON-schema vertegenwoordigt de structuur waarin gegevens worden geproduceerd of verbruikt door het back-end systeem in uw organisatie. Het Schema JSON u gebruikt zou met v4 specificatiesvolgzaam moeten zijn.

De belangrijkste eigenschappen van het gebruiken van een Schema JSON zijn:

  • De structuur van JSON wordt als een structuur weergegeven op het tabblad Inhoudszoeker in de ontwerpmodus voor een adaptief formulier. U kunt een element slepen van de JSON-hiërarchie naar het adaptieve formulier.
  • U kunt het formulier vooraf invullen met JSON dat voldoet aan het bijbehorende schema.
  • Bij verzending worden de gegevens die door de gebruiker zijn ingevoerd, verzonden als JSON die wordt uitgelijnd met het bijbehorende schema.
  • U kunt de vorm ook tot stand brengen die op het schema JSON volgens de specificaties van wordt gebaseerd 2012-20 versie.

Een JSON-schema bestaat uit eenvoudige en complexe elementtypen. De elementen hebben attributen die regels aan het element toevoegen. Wanneer deze elementen en kenmerken naar een adaptief formulier worden gesleept, worden ze automatisch toegewezen aan de corresponderende component Adaptief formulier.

Deze toewijzing van JSON-elementen met componenten Adaptief formulier ziet er als volgt uit:

"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-element, -eigenschappen of -kenmerken
Component Adaptief formulier

Tekenreekseigenschappen met de beperking enum en enumNames

Syntaxis,

{

"type" : "string",

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

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

}

Onderdeel vervolgkeuzelijst:

  • Waarden die worden vermeld in enumNames, worden weergegeven in het vak drop.
  • Waarden die in de opsomming staan, worden gebruikt voor de berekening.

Tekenreekseigenschap met indelingsbeperking. Bijvoorbeeld e-mail en datum.

Syntaxis,

{

"type" : "string",

"format" : "email"

}

  • E-mailcomponent wordt toegewezen wanneer het type tekenreeks en indeling e-mail is.
  • TextBox-component met validatie wordt toegewezen wanneer het type tekenreeks en notatie hostnaam is.

{

"type" : "string",

}

Tekstveld
number, eigenschap
Numeriek veld met subtype ingesteld op zwevend
integer, eigenschap
Numeriek veld met subtype ingesteld op geheel getal
boolean, eigenschap
Overschakelen
objecteigenschap
Deelvenster
array, eigenschap
Herhaalbaar deelvenster met min en max. gelijk aan minItems respectievelijk maxItems. Alleen homogene arrays worden ondersteund. Zo moet de puntenbeperking een voorwerp en niet een serie zijn.

Algemene schemaeigenschappen common-schema-properties

Het adaptieve formulier gebruikt informatie die beschikbaar is in het JSON-schema om elk gegenereerd veld in kaart te brengen. Met name:

  • De eigenschap title fungeert als label voor de componenten Adaptief formulier.
  • De eigenschap description wordt ingesteld als lange beschrijving voor een component Adaptief formulier.
  • De eigenschap default fungeert als beginwaarde van een veld Adaptief formulier.
  • De eigenschap maxLength wordt ingesteld als maxlength -kenmerk van de tekstveldcomponent.
  • De eigenschappen minimum, maximum, exclusiveMinimum en exclusiveMaximum worden gebruikt voor de component NumericBox.
  • Als u een bereik voor DatePicker component extra JSON-schemaeigenschappen minDate en maxDate wilt ondersteunen, worden deze opgegeven.
  • De eigenschappen minItems en maxItems worden gebruikt om het aantal items/velden te beperken dat kan worden toegevoegd aan of verwijderd uit een deelvenstercomponent.
  • Met de eigenschap readOnly wordt het kenmerk readonly van een component Adaptief formulier ingesteld.
  • De eigenschap required markeert het veld Adaptief formulier als verplicht, terwijl in het deelvenster (waar type object is) de uiteindelijke JSON-gegevens velden bevatten met een lege waarde die overeenkomt met dat object.
  • De eigenschap pattern wordt ingesteld als het validatiepatroon (reguliere expressie) in Adaptief formulier.
  • De extensie van het JSON-schemabestand moet .schema.json blijven. Bijvoorbeeld <filename>.schema.json.

Voorbeeld JSON-schema sample-json-schema

JSON Schema 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",
   "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 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",
          "aem:afProperties": {
            "sling:resourceType": "/libs/fd/af/components/guidetelephone",
            "guideNodeClass": "guideTelephone"
          }
        },
        "address": {
          "type": "string"
        }
      }
      }
  }
  }

De belangrijkste wijzigingen van de specificaties van JSON Schema V4 naar versie 2020-12 zijn:

  • Id is gedeclareerd als $id
  • definities worden gedeclareerd als $defs

Herbruikbare schemadefinities reusable-schema-definitions

De sleutels van de definitie worden gebruikt om herbruikbare schema's te identificeren. De herbruikbare schemadefinities worden gebruikt om fragmenten tot stand te brengen. Hieronder volgt een voorbeeld van een JSON-schema met definities:

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

In het bovenstaande voorbeeld wordt een klantrecord gedefinieerd, waarbij elke klant zowel een verzendadres als een factuuradres heeft. De structuur van beide adressen is zelfde-adressen heeft een straatadres, een stad en een staat— zodat is het een goed idee om de adressen niet te dupliceren. Het maakt het toevoegen en schrappen van gebieden voor om het even welke toekomstige veranderingen gemakkelijk.

Velden vooraf configureren in JSON-schemadefinitie pre-configuring-fields-in-json-schema-definition

U kunt gebruiken aem:afProperties bezit om het gebied van het Schema van JSON vooraf te vormen om aan een component van de Vorm van de douaneAanpassings in kaart te brengen. Hieronder ziet u een voorbeeld:

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

Acceptabele waarden voor een adaptieve formuliercomponent beperken limit-acceptable-values-for-an-adaptive-form-component

U kunt de volgende beperkingen toevoegen aan JSON-schemaelementen om de waarden te beperken die acceptabel zijn voor een adaptieve formuliercomponent:

Schema, eigenschap
Gegevenstype
Beschrijving
Component
maximum
String
Hiermee geeft u de bovengrens voor numerieke waarden en datums op. Standaard wordt de maximumwaarde opgenomen.
  • Numeriek vak
  • Numerieke stap
  • Datumkiezer
minimum
String
Hiermee geeft u de ondergrens voor numerieke waarden en datums op. Standaard wordt de minimumwaarde opgenomen.
  • Numeriek vak
  • Numerieke stap
  • Datumkiezer
exclusiveMaximum
Boolean

Indien waar (true), moet de numerieke waarde of datum die in de component van het formulier is opgegeven, kleiner zijn dan de numerieke waarde of datum die voor de eigenschap maximum is opgegeven.

Indien onwaar, moet de numerieke waarde of datum die in de component van de vorm wordt gespecificeerd minder dan of gelijk aan de numerieke waarde of de datum zijn die voor het maximumbezit wordt gespecificeerd.

  • Numeriek vak
  • Numerieke stap
  • Datumkiezer
exclusiveMinimum
Boolean

Indien waar (true), moet de numerieke waarde of datum die in de component van het formulier is opgegeven, groter zijn dan de numerieke waarde of datum die voor de eigenschap minimum is opgegeven.

Indien onwaar, moet de numerieke waarde of datum die in de component van de vorm wordt gespecificeerd groter zijn dan of gelijk aan de numerieke waarde of de datum die voor het minimumbezit wordt gespecificeerd.

  • Numeriek vak
  • Numerieke stap
  • Datumkiezer
minLength
String
Hiermee wordt het minimale aantal tekens opgegeven dat in een component is toegestaan. De minimumlengte moet gelijk zijn aan of groter zijn dan nul.
  • Tekstvak
maxLength
String
Hiermee wordt het maximale aantal tekens opgegeven dat in een component is toegestaan. De maximumlengte moet gelijk zijn aan of groter zijn dan nul.
  • Tekstvak
pattern
String

Hiermee geeft u de volgorde van de tekens op. Een component accepteert de tekens als de tekens overeenkomen met het opgegeven patroon.

De eigenschap pattern verwijst naar het validatiepatroon van de overeenkomstige component Adaptief formulier.

  • Alle adaptieve Forms-componenten die zijn toegewezen aan een XSD-schema
maxItems
String
Geeft het maximale aantal items in een array op. De maximale items moeten gelijk zijn aan of groter zijn dan nul.
minItems
String
Geeft het minimale aantal items in een array op. De minimale items moeten gelijk zijn aan of groter zijn dan nul.

Schema-compatibele gegevens inschakelen enablig-schema-compliant-data

Voer de volgende stappen uit om alle op JSON-schema's gebaseerde Adaptieve Forms in staat te stellen schema-compatibele gegevens te genereren bij het verzenden van formulieren:

  1. Ga naar de webconsole van de Experience Manager op https://server:host/system/console/configMgr .
  2. Zoek Adaptive Form and Interactice Communication Web Channel Configuration .
  3. Selecteer deze optie om de configuratie te openen in de bewerkingsmodus.
  4. Schakel het selectievakje Generate Schema Compliant Data in.
  5. Sla de instellingen op.

adaptieve vorm en interactieve configuratie van het communicatieWebkanaal

Niet-ondersteunde constructies non-supported-constructs

Adaptive Forms biedt geen ondersteuning voor de volgende JSON-schemaconstructies:

  • Null-tekst
  • Unietypen zoals alle, en
  • OneOf, anyOf, allOf, and not
  • Alleen homogene arrays worden ondersteund. De itembeperking moet dus een object zijn en geen array.
  • URI-verwijzingen in $ref

Veelgestelde vragen frequently-asked-questions

waarom ik niet individuele elementen van een subformulier (structuur die van om het even welk complex type wordt geproduceerd) voor herhaalbare subforms (minOccurs of maxOccurs waarden zijn groter dan 1) kan slepen?

In een herhaalbaar subformulier moet u het volledige subformulier gebruiken. Als u alleen selectieve velden wilt, gebruikt u de volledige structuur en verwijdert u de ongewenste velden.

ik heb een lange complexe structuur in de Vinder van de Inhoud. Hoe kan ik een specifiek element vinden?

U hebt twee opties:

  • Door de boomstructuur schuiven
  • Gebruik het vak Zoeken om een element te zoeken

wat de uitbreiding van het JSON schemadossier zou moeten zijn?

De extensie van het JSON-schemabestand moet .schema.json zijn. Bijvoorbeeld <filename>.schema.json.

Zie ook see-also

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