MultiStep Form mit ├ťbersichtsseite

  • Profile Image
    Roman Baier 
    Asked on May 04, 2021 at 08:03 AM

    Guten Tag,

    ich ben├Âtige Hilfe beim erstellen eines Formulars.

    Im Screenshot sieht man ein Formular zum erfassen eines neuen Fahrzeug-Inserats f├╝r einen Fahrzeugmarkt.

    Sie k├Ânnen das Formular auch selbst einsehen, dazu m├╝ssen Sie folgende Schritte durchf├╝hren.

    Generell gesehen ist es ein mehrseitiges Formular mit ca. 20-30 Seiten.

    Das Problem, welches ich gerade nicht l├Âsen kann ist, wie man eine Status-├ťbersichtsseite erstellen kann (Screenshot) woraus man von einer Seite zur anderen Navigieren kann, wenn man dem automatischen Leitfaden nicht folgen m├Âchte.


    K├Ânnten Sie mir helfen diese Art Formular zu erstellen?


    Viele Gr├╝├če

    Roman Baier


  • Profile Image
    Dagmar_B
    Answered on May 05, 2021 at 01:00 AM

    Hallo,

    Dem Screenshot nach zu Urteilen ist diese Start-Seite ein Formular mit ein- und ausklappenden Bereichen.

    Dies k├Ânnen sie durch Einbau von Feldern zum Abschnitt einklappen erreichen:

    1620190303_6092245fa965e_

    In Benutzung sieht dies dann so aus:

    1620190441_609224e970544_

    Es ist dann kein mehrseitiges Formular mehr, da alle Punkte ja als ├ťbersicht auf der ersten Seite sichtbar sind.

    Die Unterpunkte k├Ânne durch Bedingungen zus├Ątzlich weiter ein und ausgeblendet werden, je nachdem was vom Nutzer ausgew├Ąhlt wird. Smarte-Formulare: Bedingte-Logik-f├╝r-online-Formulare

    Alternativ k├Ânnten Sie das Formular mit dem Seitenumbruch in verschiedene Seiten teilen und dann mit dem Breadcrumb-Widget eine Navigation erstellen:

    1620190701_609225ed01310_

    Ich hoffe, dies hilft Ihnen weiter. Kommen Sie gerne mit weiteren Fragen wieder auf uns zu.

  • Profile Image
    Roman_Baier_spam
    Answered on May 05, 2021 at 02:44 AM

    Hallo Dagmar,

    danke f├╝r deine R├╝ckmeldung. Dein Ansatz wird mir helfen die ├ťbersichtsseite anzulegen, danke.

    Die Logik hinter der ├ťbersichtsseite ist jedoch eine andere.

    Im folgenden zeige ich dir einige Screenshots.


    1620196355_60923c0319a65_Bildschirmfoto

    durch das klicken auf den Button Bearbeiten gelangt man zur Detailseite um die Daten passend zu diesem Bereich hinterlegen zu k├Ânnen..


    1620196463_60923c6fc443c_Bildschirmfoto%

    Sobald man hier auf den Button "Ready" klickt wird in der ├ťbersichtsseite das Symbol gr├╝n dargestellt.

    Wie du gleich sehen wirst, ist es also nicht eine einfache Checkbox sonder zeigt den Status des folgenden Bereiches an. Kann man so etwas umsetzen?


    1620196464_60923c704e7d9_Bildschirmfoto


    1620196464_60923c702f7fd_Bildschirmfoto



    1620196463_60923c700071c_Bildschirmfoto%




    1620196464_60923c7040c23_Bildschirmfoto

    1620196463_60923c6fbb6ea_Bildschirmfoto






    Es w├╝rde mich freuen wenn ich so eine Struktur in einem anderen Design mit Jotform umsetzen k├Ânnte.

    Vielen Dank f├╝r deine Hilfe

















  • Profile Image
    Dagmar_B
    Answered on May 05, 2021 at 04:07 AM

    Hallo Roman,

    Ja, ich sehe, was Sie meinen.

    Es sollen auf der ersten Seite ├änderungen vorgenommen werden, je nachdem, was auf den Unterseiten/Unterformularen ge├Ąndert wird. Das k├Ânnte ├╝ber Bedingungen, die Schalter umlegen, wenn ein bestimmtes Feld ausgef├╝llt wurde vielleicht m├Âglich sein.

    Ich w├╝rde gerne daran noch ein wenig weiter probieren.

    Ich melde mich bald wieder.

  • Profile Image
    Dagmar_B
    Answered on May 07, 2021 at 02:24 AM

    Hallo,

    Entschuldigen Sie die sp├Ąte Antwort.

    Der Wechsel auf die n├Ąchste (Unter-)Seite mit der Bedingung "Springe zu Seite" wird immer erst durch den Klick auf den Weiter-Button ausgel├Âst.

    Vielleicht ist es n├Âtig das Formular hier bei Jotform anders aufzubauen.

    Erste Seite: ├ťbersicht ├╝ber alle Fragen

    Zweite Seite: BASICS mit aufklappbaren Abschnitten zu allen Unterpunkten

    Seite Drei: Finacial mit aufklappbaren Abschnitten zu allen Unterpunkten

    usw.

    Dann k├Ânnen Sie das Widget ├ťberpr├╝fen vor dem Absenden einbinden und der Nutzer kann sich noch einmal alles vor dem Absenden anschauen.

    1620368558_6094dcaecada2_

    Vielleicht geht es so. Bei weiteren Fragen stehen wir gerne zur Verf├╝gung.