Skapa ett adaptivt formulär creating-an-adaptive-form-core-components

Version
Artikellänk
AEM 6.5
Klicka här
AEM as a Cloud Service
Den här artikeln

Med anpassningsbara Forms kan du skapa engagerande, responsiva, dynamiska och anpassningsbara formulär. AEM Forms har en användarvänlig guide för att snabbt skapa Adaptiv Forms. Guiden har en snabb fliknavigering där du enkelt kan välja förkonfigurerade mallar, format, fält och alternativ för att skicka formulär för att skapa ett adaptivt formulär.

Innan du börjar får du lära dig mer om vilken typ av Forms-komponenter du kan använda:

  • Adaptiva Forms Core-komponenter: Dessa är standardiserade datainhämtningskomponenter. Dessa komponenter har anpassningsmöjligheter, kortare utvecklingstid och lägre underhållskostnader för era digitala registreringsupplevelser. En utvecklare kan enkelt anpassa och utforma dessa komponenter. Adobe rekommenderar att du använder dessa moderna och utbyggbara komponenter för att utveckla Adaptiv Forms.

  • Adaptiva Forms Foundation-komponenter: Dessa är klassiska (gamla) datainhämtningskomponenter. Du kan fortsätta att använda dessa för att redigera dina befintliga grundläggande komponentbaserade adaptiva formulär. Om du skapar nya formulär rekommenderar Adobe att du använder adaptiva Forms Core-komponenter för att skapa en adaptiv Forms.

Guiden för att skapa ett anpassat formulär

Krav

Du behöver följande för att skapa ett adaptivt formulär:

  • Aktivera adaptiva Forms Core-komponenter för din miljö: När du skapar ett program är de adaptiva Forms Core-komponenterna redan aktiverade för din miljö. Om du har en Forms as a Cloud Service-miljö baserad på Arketyp 39 eller tidigare Aktivera adaptiva Forms Core-komponenter för din miljö. När du aktiverar kärnkomponenterna för din miljö läggs mallen och arbetsytetemat Adaptive Forms (Core Component) till i din miljö. Om din AEM SDK-version är äldre än 2023.02.0 bör du kontrollera att du har prerelease -flaggan aktiverad i miljön eftersom adaptiva Forms Core-komponenter ingick i förversionen före version 2023.02.0.

  • En mall för adaptiva formulär: En mall innehåller en grundläggande struktur och definierar utseendet (layouter och format) för ett adaptivt formulär. Den har förformaterade komponenter som innehåller vissa egenskaper och innehållsstruktur. Här finns också alternativ för att definiera ett tema och en skicka-åtgärd. Temat definierar utseendet, känslan och skickaåtgärden definierar vilken åtgärd som ska vidtas när ett adaptivt formulär skickas in. Du kan till exempel skicka insamlade data till en datakälla. Molntjänsten tillhandahåller en OOTB-mall med namnet blank:

    • Mallen blank ingår i alla nya as a Cloud Service AEM Forms-program.
    • Du kan installera referenspaketet via Package Manager för att lägga till mallen blank i ditt AEM Forms as a Cloud Service-program.
    • Du kan även skapa en anpassad Forms-mall (kärnkomponenter) från början.
    • Du kan också distribuera exempelmallar till din miljö. Med dessa kan du snabbt börja skapa formulär.
  • Ett adaptivt formulärtema: Ett tema innehåller formatinformation för komponenterna och panelerna. Format innehåller egenskaper som bakgrundsfärger, lägesfärger, genomskinlighet, justering och storlek. När du använder ett tema återspeglas det angivna formatet i motsvarande komponenter. Mallen Canvas ingår i alla nya as a Cloud Service AEM Forms-program. Du kan också distribuera exempelteman till din miljö. Dessa hjälper dig att börja utforma formulären och skapa en grundstruktur för att skapa eller anpassa ett tema efter företagets behov.

  • Behörigheter: Lägg till dina användare i gruppen forms-users. Medlemmarna i gruppen forms-users har behörighet att skapa ett anpassat formulär. En detaljerad lista över formulärspecifika användargrupper finns i Grupper och behörigheter.

Skapa ett adaptivt formulär create-an-adaptive-form-core-components

  1. Logga in på din Experience Manager Forms Author-instans. Det kan vara en molninstans eller en lokal utvecklingsinstans.

  2. Ange dina uppgifter på inloggningssidan för Experience Manager. När du är inloggad väljer du Adobe Experience Manager > Forms > Forms & Documents i det övre vänstra hörnet.

  3. Välj Create > Adaptive Forms. Guiden öppnas. På fliken Source väljer du en mall:

    Kärnkomponentmall

    När du väljer en mall markeras automatiskt ett tema och en skicka-åtgärd som anges i mallen och knappen Create aktiveras. Du kan gå till flikarna Style eller Submission och välja ett annat tema eller skicka-åtgärd. Om den valda mallen inte anger något tema förblir knappen Skapa inaktiverad. Du kan gå till fliken Styles och välja ett tema manuellt.

    note note
    NOTE
    Om du inte har det, Adaptiv Forms-mall (Core Component) i din miljö, Aktivera adaptiva Forms Core-komponenter för din miljö. När du aktiverar kärnkomponenterna för din miljö läggs mallen Adaptive Forms (Core Component) till i din miljö.
  4. Välj ett tema på fliken Style:

    • När den valda mallen anger ett tema väljs temat automatiskt i guiden. Du kan också välja ett annat tema på fliken Format.

    • Om den valda mallen inte anger något tema kan du använda fliken Format för att välja ett tema. Knappen Create aktiveras först när ett tema har valts.

  5. (Valfritt) Välj en datamodell på fliken Data:

    • Formulärdatamodell (FDM): Med en formulärdatamodell kan du integrera entiteter och tjänster från olika datakällor i ett adaptivt formulär. Välj FDM (Form Data Model) om det adaptiva formulär du skapar inbegriper att hämta och skriva data från och till flera datakällor.

    • JSON-schema: JSON-schema Med vår Core-Components-baserade adaptiva form kan du smidigt integrera med din organisations back-end-system genom att tillhandahålla möjligheten att associera ett JSON-schema, som representerar strukturen för de data som produceras eller förbrukas. Den här kopplingen gör det möjligt för författare att dynamiskt lägga till innehåll i det adaptiva formuläret med elementen i schemat. Elementen i schemat är enkelt tillgängliga på fliken Datamodellsobjekt i innehållsläsaren under redigeringsprocessen, och alla fält läggs automatiskt till i alla skapade adaptiva formulär.

    Som standard markeras alla fält i det associerade JSON-schemat automatiskt och konverteras till motsvarande adaptiva formulärkomponenter, vilket effektiviserar redigeringsprocessen. I guiden kan du välja vilka fält som ska inkluderas i det anpassade formuläret med hjälp av kryssrutor.

  6. Välj en sändningsåtgärd på fliken Submission:

    • När du väljer en mall markeras åtgärden Skicka som anges i mallen automatiskt. Du kan välja en annan skickaåtgärd på fliken Skicka. Fliken ​ Submission visar alla tillgängliga skicka-åtgärder.

    • När den valda mallen inte anger någon skicka-åtgärd kan du använda fliken Submission för att välja en skicka-åtgärd

  7. (Valfritt) På fliken Delivery kan du ange ett publicerings- eller avpubliceringsdatum för ett adaptivt formulär.

  8. Välj Create. En dialogruta där du kan ange namn, namn och plats för att spara det adaptiva formuläret visas:

    • Title Anger formulärets visningsnamn. Titeln hjälper dig att identifiera formuläret i användargränssnittet för Experience Manager Forms.
    • Name: Anger formulärets namn. En nod med det angivna namnet skapas i databasen. När du börjar skriva en titel genereras värdet för namnfältet automatiskt. Du kan ändra det föreslagna värdet. Namnfältet får endast innehålla alfanumeriska tecken, bindestreck och understreck. Alla ogiltiga indata ersätts med ett bindestreck.
    • Path: Anger platsen där det adaptiva formuläret ska sparas. Du kan spara det adaptiva formuläret direkt på /content/dam/formsanddocuments eller skapa en mapp som /content/dam/formsanddocuments/adaptiveforms om du vill spara ett adaptivt formulär. Se till att du skapar mappen innan du använder den i sökvägen. Fältet Path skapar inte en mapp automatiskt.
  9. Välj Create. Ett adaptivt formulär skapas och öppnas i den adaptiva Forms-redigeraren. Redigeraren visar det innehåll som är tillgängligt i mallen. Baserat på typen av anpassat formulär visas formulärelementen i det associerade JSON-schemat eller formulärdatamodellen (FDM) på fliken Data Model Objects i Content Browser i sidlisten. Du kan också dra och släppa dessa element för att skapa ett anpassat formulär.

Nu kan du dra och släppa adaptiva Forms Core-komponenter till en adaptiv Forms-behållare för att utforma och skapa formuläret. Du kan även besöka https://aemcomponents.dev/ för att se hur de tillgängliga kärnkomponenterna fungerar i praktiken.

Konfigurera åtgärden Skicka för ett anpassat formulär configure-submit-action-for-form

Med en Skicka-åtgärd kan du välja målet för data som har hämtats via ett anpassat formulär. Den aktiveras när en användare klickar på knappen Skicka på ett anpassat formulär. Anpassade formulär innehåller några av de åtgärder som har vidtagits för att skicka in. Du kan också utöka en standardåtgärd för att skicka för att skapa en egen anpassad åtgärd. Så här konfigurerar du en Skicka-åtgärd för formuläret:

  1. Öppna innehållsläsaren och markera komponenten Guide Container i det adaptiva formuläret.

  2. Klicka på ikonen för egenskaper för stödlinjebehållaren Egenskaper för stödlinje . Dialogrutan Adaptiv formulärbehållare öppnas.

  3. Klicka på fliken Submission.

    Klicka på skiftnyckelsikonen för att öppna dialogrutan Adaptiv formulärbehållare och konfigurera en sändningsåtgärd

  4. Välj och konfigurera en Submit action utifrån dina krav. Mer information om Skicka-åtgärder finns i Åtgärden Skicka anpassat formulär

Dirigera om användaren till en sida eller visa ett tackmeddelande när formuläret skickas

När du skickar ett formulär kan du dirigera om användaren till en annan webbsida eller ett meddelande. Så här omdirigerar du användaren eller konfigurerar tackmeddelandet:

  1. Öppna innehållsläsaren och markera komponenten Guide Container i det adaptiva formuläret.

  2. Klicka på ikonen för egenskaper för stödlinjebehållaren Egenskaper för stödlinje . Dialogrutan Adaptiv formulärbehållare öppnas.

  3. Öppna fliken Submission.

    Klicka på skiftnyckelsikonen för att öppna dialogrutan Adaptiv formulärbehållare och konfigurera en omdirigeringssida eller tacka dig för meddelandet

    • Om du vill konfigurera en omdirigerings-URL, för alternativet Skicka, markerar du alternativet Redirect to URL och bläddrar och väljer en AEM Sites-sida, eller anger en URL för en extern sida.

    • Om du vill konfigurera ett anpassat meddelande eller ett tackmeddelande för alternativet Skicka markerar du alternativet Show Message och anger ett meddelande i rutan Message content. Det är en RTF-ruta som du kan använda helskärmsalternativet för att visa alla tillgängliga RTF-objekt.

Konfigurera ett schema eller en formulärdatamodell (FDM) för ett anpassat formulär configure-schema-or-data-model-for-form

Du kan använda formulärdatamodellen (FDM) för att ansluta ett formulär till en Data Source för att skicka och ta emot data baserat på användaråtgärder. Du kan också ansluta ett formulär till ett JSON-schema för att ta emot skickade data i ett fördefinierat format. Beroende på behovet kan du ansluta formuläret till ett JSON-schema eller en FDM-modell (Form Data Model):

Konfigurera ett JSON-schema eller en formulärdatamodell (FDM) för formuläret

Så här konfigurerar du ett JSON-schema eller en formulärdatamodell (FDM) för formuläret:

  1. Öppna innehållsläsaren och markera komponenten Guide Container i det adaptiva formuläret.

  2. Klicka på ikonen för egenskaper för stödlinjebehållaren Egenskaper för stödlinje . Dialogrutan Adaptiv formulärbehållare öppnas.

  3. Öppna fliken Data Model.

    Klicka på skiftnyckelsikonen för att öppna dialogrutan Adaptiv formulärbehållare och konfigurera ett JSON-schema eller en formulärdatamodell (FDM)

  4. Välj och konfigurera ett JSON-schema eller en formulärdatamodell (FDM) utifrån dina krav:

    • När du väljer alternativet Form Model använder du alternativet Select Form Data Model för att välja en förkonfigurerad formulärdatamodell (FDM).
    • När du väljer alternativet Schema använder du alternativet Schema för att välja ett JSON-schema för formuläret.
  5. Klicka på Done.

Konfigurera en förifyllningstjänst configure-prefill-service-for-form

Du kan använda förifyllningstjänsten för att autofylla fält i ett adaptivt formulär med befintliga data. När en användare öppnar ett formulär är värdena för dessa fält förifyllda. Du kan:

Använd förifyllningstjänsten för formulärdatamodell för att fylla i fält i ett adaptivt formulär i förväg fdm-prefill-service

Du kan använda förifyllningstjänsten för formulärdatamodell för att fylla i fält i ett adaptivt formulär i förväg med hjälp av en formulärdatamodell eller en anpassad förifyllningstjänst. Tjänsten för förifyllning av formulärdatamodell använder tjänsten Hämta tjänst för den konfigurerade formulärdatamodellen för att hämta data. Så här använder du förifyllningstjänsten för formulärdatamodell för ett adaptivt formulär:

  1. Öppna innehållsläsaren och markera komponenten Guide Container i det adaptiva formuläret.
  2. Klicka på ikonen för egenskaper för stödlinjebehållaren Egenskaper för stödlinje . Dialogrutan Adaptiv formulärbehållare öppnas.
  3. Klicka på ikonen för den adaptiva formulärbehållaren Egenskaper för den adaptiva formulärbehållaren . Dialogrutan Adaptiv formulärbehållare öppnas för att konfigurera datamodeller.
    Klicka på skiftnyckelsikonen för att öppna dialogrutan Adaptiv formulärbehållare och konfigurera en omdirigeringssida eller tacka dig för meddelandet
  4. Välj en formulärdatamodell (FDM). Öppna fliken Basic. Välj Form Data Model Prefill Service i förifyllningstjänsten.
  5. Klicka på Done. Ditt adaptiva formulär har nu konfigurerats för att använda förifyllning av formulärdatamodell. Du kan nu använda regelredigeraren för att skapa regler för att fylla i formulärfält i förväg.

Redigera formulärmodellegenskaper för ett adaptivt formulär edit-form-model

  1. Markera det adaptiva formuläret och välj Sidinformation > Open Properties. Sidan Formuläregenskaper öppnas.

  2. Gå till fliken Form Model och välj en formulärmodell. Om det adaptiva formuläret inte har någon formulärmodell kan du välja antingen ett JSON-schema eller en formulärdatamodell (FDM). Om det adaptiva formuläret däremot redan är baserat på en formulärmodell kan du växla till en annan formulärmodell av samma typ. Om formuläret till exempel använder ett JSON-schema kan du enkelt växla till ett annat JSON-schema, och om formuläret använder en formulärdatamodell (FDM) kan du på liknande sätt växla till en annan formulärdatamodell (FDM).

  3. Välj Save om du vill spara egenskaperna.

Hur byter jag namn på ett AEM anpassat formulär? rename-an-AEM-Adaptive-Form

Så här byter du namn på ett anpassat formulär:

  1. Välj ett anpassningsbart formulär i AEM Forms användargränssnitt.
  2. Klicka på Egenskaper i den övre listen.
  3. Ändra namnet på formuläret på fliken Titel, så som visas i bilden nedan.
  4. Klicka på Spara och stäng.

Byt namn på ett AEM anpassat formulär

Se även see-also

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