1. Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!
    Information ausblenden

Fragebogen in HTML

Dieses Thema im Forum "HTML, XHTML & CSS" wurde erstellt von bzwerg, 2 November 2017.

  1. bzwerg

    bzwerg Neues Mitglied

    Registriert seit:
    23 Januar 2017
    Beiträge:
    21
    Punkte für Erfolge:
    1
    Hallo zusammen, ich bin mir nicht sicher in welchem Unterforum meine Frage reingehört, deshalb mein Versuch hier.

    Ich möchte gern eine Art Fragebogen in HTML/Script erstellen. Der User soll zu Beginn beispielsweise zwei Buttons haben (Geschlecht? Mann/Frau) und wenn er auf ein Button klickt (Mann), erscheinen/öffnen sich im selben Fenster weitere Buttons (Wie alt? 20-30/30-40) und so weiter. Der User soll also immer passende weitere Wahlmöglichkeiten erhalten, abhängig von seiner vorherigen Antwort. Ähnlich wie man diese Psychotests in Zeitungen kennt. Zum Ende bekommt der User eine Empfehlung/Anweisung aufgrund seiner persönlichen Antworten.

    Das ganze soll in Sharepoint umgesetzt werden.

    Habt ihr eine Idee, wie man das umsetzen kann?
     
    Werbung:

    Jetzt registrieren, damit diese Werbung verschwindet
  2. Aaron3219

    Aaron3219 Aktives Mitglied

    Registriert seit:
    6 Oktober 2015
    Beiträge:
    516
    Punkte für Erfolge:
    43
    Mit der if-Function von Sharepoint solltest du das hinbekommen. Habe da leider nur mäßig erfahrung, ob es auch unkompliziertere Wege gibt. Aber es gibt auf jeden Fall die if-Function.

    if Auswahl = Männlich, dann
    else if Auswahl = Weiblich, dann
     
  3. bzwerg

    bzwerg Neues Mitglied

    Registriert seit:
    23 Januar 2017
    Beiträge:
    21
    Punkte für Erfolge:
    1
    Hallo nochmal, ich hab den Fragebogen jetzt wie folgt programmiert. Funktioniert aus meiner Sicht sehr gut. Ein geübter Programmierer kann hier sicherlich den Code noch etwas kürzen. Ich hatte es mit Arrays versucht, jedoch ohne Erfolg. Würdet ihr am Code etwas verändern/vereinfachen?

    https://jsfiddle.net/sruwkgp1/1/

    Danke schonmal im voraus!
     
  4. Aaron3219

    Aaron3219 Aktives Mitglied

    Registriert seit:
    6 Oktober 2015
    Beiträge:
    516
    Punkte für Erfolge:
    43
    Mit Jquery würdest du den Kram schonmal wesentlich kürzer hinbekommen, da du dort für mehrere Elemente CSS-Attribute gleichzeitig benutzt. Und um den Code nicht immer zu copy-pasten nur mit anderer Zahl, mache ich dir später mal was fertig, habe gerade keine Zeit. Aber dein Code ist dann 10 mal so kurz.

    Edit:
    Ich weiß, dass ich dir den Kram dann vorlege und du prinzipiell copy-pasten kannst ohne es selber zu lernen. Ich empfehle dir aber wirklich, sich damit zu beschäftigen. Ansonsten wird eine Veränderung des Codes ziemlich kompliziert für dich. Bei Fragen bist du hier natürlich immer willkommen.
     
  5. Aaron3219

    Aaron3219 Aktives Mitglied

    Registriert seit:
    6 Oktober 2015
    Beiträge:
    516
    Punkte für Erfolge:
    43
    So ich habe da mal was fertig gemacht.
    Anhand der Unterstriche, lässt sich dein Wahlpfad erkennen.
    Antwort1_2_2
    würde dann z.B. für
    Antwort 1 gewählt, dann Antwort 2 gewählt und dann nochmal Antwort 2 gewählt stehen.
    Der Code ist auch um einiges kürzer geworden ;)

    https://jsfiddle.net/8f8yw180/1/
     
    bzwerg gefällt das.
  6. bzwerg

    bzwerg Neues Mitglied

    Registriert seit:
    23 Januar 2017
    Beiträge:
    21
    Punkte für Erfolge:
    1
    Hey, besten Dank! Ich bin gerade bei den Anfängen von Java Script, komme aber noch zu Jquery. Dein Code ist dann eine prima Übung :).

    Vielen Dank für deine Hilfe!
     
  7. Sempervivum

    Sempervivum Aktives Mitglied

    Registriert seit:
    18 Oktober 2016
    Beiträge:
    763
    Punkte für Erfolge:
    43
    Das wäre genau der richtige Ansatz gewesen. Ich hatte erwartet, dass Aaron es auch so macht.
    So könnte es mit einem Array/Objekt ausssehen:
    https://jsfiddle.net/Sempervivum/b9Lzeygg/2/
    (Auf das CSS habe ich hier nicht so viel Wert gelegt)
    Das explodiert ja: 1. Frage --> 2 Antworten, 2 * 2. Frage --> 4 Antworten, 4 *4. Frage --> 8 Antworten usw.
     
    Zuletzt bearbeitet: 18 November 2017
  8. Aaron3219

    Aaron3219 Aktives Mitglied

    Registriert seit:
    6 Oktober 2015
    Beiträge:
    516
    Punkte für Erfolge:
    43
    Ich habe vorher auch noch nie einen Fragebogen geschrieben. JSFiddle ist gerade nicht erreichbar, aber mich interessiert brennend, wie du das umgesetzt hast. Mir ist selber schon aufgefallen, dass die Fragen "explodieren".

    Edit:
    @Sempervivum deine Lösung mit Arrays ersetzt doch aber nur den HTML-Code oder etwa nicht?
    In diesem Falle würden die Arrays "explodieren". Die Länge des Codes pro Array sind dann genauso lang, wie in html.
     
    Zuletzt bearbeitet: 18 November 2017
  9. Sempervivum

    Sempervivum Aktives Mitglied

    Registriert seit:
    18 Oktober 2016
    Beiträge:
    763
    Punkte für Erfolge:
    43
    Ja, das Problem mit dem Explodieren liegt wohl in der Natur der Sache, dafür habe ich auch keine Lösung.
     
  10. bzwerg

    bzwerg Neues Mitglied

    Registriert seit:
    23 Januar 2017
    Beiträge:
    21
    Punkte für Erfolge:
    1
    Komme jetzt erst dazu das Problem weiter anzugehen. In jfdiddle sieht deine Lösung perfekt aus. Wenn die ich einzelnen Bestandteile (js, css, html) in eine Datei.html zusammenfüge, funktioniert es aber nicht?!
     
  11. Aaron3219

    Aaron3219 Aktives Mitglied

    Registriert seit:
    6 Oktober 2015
    Beiträge:
    516
    Punkte für Erfolge:
    43
    Ich rate einfach mal und sage, dass du JQuery vergessen hast einzubinden.
    Füge das hier in den <header>:
    HTML:
    1. <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
     
  12. bzwerg

    bzwerg Neues Mitglied

    Registriert seit:
    23 Januar 2017
    Beiträge:
    21
    Punkte für Erfolge:
    1
    alles klar, mein Fehler. Bin bei jQuery noch nicht angekommen. Danke!!
     
  13. bzwerg

    bzwerg Neues Mitglied

    Registriert seit:
    23 Januar 2017
    Beiträge:
    21
    Punkte für Erfolge:
    1
    @Aaron3219: Hab deinen jQuery jetzt verstanden. Ich sehe nur ein Problem:

    Du nimmst immer:
    var getID = antwort1
    var sub = 1
    So wird antwort1_1 angesprochen. Klappt.

    var getID = antwort2
    var sub = 2
    So wird antwort2_2 angesprochen. Klappt nur, wenn auch ein antwort2_2 vorhanden ist. Eventuell gibt es hier nur eine Antwort.

    Fügen wir noch ein DIV zum Beginn dazu:
    var getID = antwort3
    var sub = 3
    Das erfordert, dass antwort3_3 vorhanden ist.

    Ich habe nun var sub = 1 gewählt. Scheint zu funktionieren. Siehst du Komplikationen?

    Explodieren tut es nicht, da die DIVs begrenzt sind.
     
  14. Aaron3219

    Aaron3219 Aktives Mitglied

    Registriert seit:
    6 Oktober 2015
    Beiträge:
    516
    Punkte für Erfolge:
    43
    Also ich beschäftige mich nochmal mit einem voll automatischen System.
    Hatte eh mal sowas vor.

    Wenn es an sich funktioniert, sehe ich kein Problem.
    Ich beschäftige mich später mal damit