Anzeigen des Formulars beim Klicken auf eine Karte

Letzte Aktualisierung: 2024-01-29
  • Erstellt für:
  • Intermediate
    User

Der folgende Code wurde verwendet, damit das Formular angezeigt wird, wenn Benutzende auf eine Karte klicken. Der Pfad des anzuzeigenden Formulars wird mithilfe der Funktion „useParams“ aus der URL extrahiert.

import Form from './components/Form';
import PlainText from './components/plainText';
import TextField from './components/TextField';
import Button from './components/Button';
import Panel from './components/Panel';
import { useState,useEffect } from "react";
import {Link, useParams} from 'react-router-dom';
import { AdaptiveForm } from "@aemforms/af-react-renderer";
export default function DisplayForm()
{
   const [selectedForm, setForm] = useState("");
   const params = useParams();
   const extendMappings =
    {
        'plain-text' : PlainText,
        'text-input' : TextField,
        'button' : Button,
        'form': Form
    };


   const getAFForm = async () =>
    {

        const resp = await fetch(`/adobe/forms/af/${params.formID}`);
        let formJSON = await resp.json();
        console.log("The contact form json is "+formJSON);
        setForm(formJSON.afModelDefinition)
    }

    useEffect( ()=>{
        getAFForm()


    },[]);
    return(
       <div>
           <AdaptiveForm mappings={extendMappings} formJson={selectedForm}/>
        </div>
    )
}

Nächste Schritte

Anzeigen einer Dankesnachricht bei Formularübermittlung

Auf dieser Seite