Neue Fragen auf der selben Seite in Abhängigkeit der Auswahl bei einer Multiple Choice Frage

Question

Hallo liebes Sosci Team.
Ich habe in dem Fragebogen eine multiple choice Frage. Je nach dem welche Antwortoptionen ausgewählt werden, sollen auf der selben Seite des Fragebogens neue offene Fragen mit Textanweisungen erscheinen. Wie kann ich das einstellen?
Vielen Dank

Answer 1

Bitte starten Sie mit dieser Anleitung:
Fragen bei Auswahl einer bestimmten Option sofort einblenden

Comments

Sehr geehrtes SosciSurvey Team.

ich habe die Anleitung durchgeführt, jedoch ein kleines Problem. Ich arbeite mit einer Multiple Choice Frage und bei jeder Auswahl einer Option soll ein neues Textfeld auf der selben Seite auftauchen. Wenn ich A auswähle taucht also Textfeld A auf, ansonsten nicht. Wenn ich B auswähle taucht Textfeld B auf, ansonsten nicht. Wenn ich A und B auswähle sollen auch Textfeld A und B auftauchen. Das funktioniert nicht (ich denke aufgrund des "else"-Satzes im Code, was ja theoretisch verbietet Textfeld B zu öffnen wenn ich Antwort A ausgewählt habe. Ich habe auf der Seite eine Lösung gesehen, wenn man verschiedene Fragen auf der selben Seite verwendet, jedoch nicht, wenn es um mehrere Antwortoption bei der selben Frage geht. Aktuell verwende ich zwei Codes, die ich als Textbausteine hinzugefügt habe und dann beide im Fragebogen unter die jeweilige Frage/Text hinzugefügt habe. Ich denke, dass es Sinn ergeben würde, einen Code für beides zu erstellen, komme da aber leider nicht weiter. Könnten Sie mir da helfen?

Das ist der Code wenn Antwortoption A ausgewählt wird, bei Antwortoption B wurde das "A" ausgetauscht und die Itemkennung der Frage und des Textfeldes angepasst:

<p><br></p>
<script type="text/javascript">
<!--
var optionA = document.getElementById("S103_01");  
var frage = document.getElementById("S104_qst");
 
function toggle() {
  if (optionA.checked) {
    frage.style.display = "";
  } else {
    frage.style.display = "none";
  }
}
 
SoSciTools.attachEvent(optionA, "click", toggle);

toggle();
</script>

---

Wenn Sie mehrfach denselben Zusammenhang brauchen, bietet es sich an, das in eine Funktion bzw. eine Klasse zu packen. Das könnte so aussehen:

function ToogleText(checkboxID, inputID) {
  var checkbox = document.getElementById(checkboxID);
  var input = document.getElementById(inputID);
  checkbox.addEventListener("click", function(evt) {
    if (checkbox.checked) {
      input.style.display = "";
    } else {
      input.style.display = "none";
    }
  });
}

Diese Klasse initiieren Sie nun für jedes Pärchen auf Auswahlfeld und Textfeld, also z.B. Auswahlfeld "CB01_01" und Texteingabefeld "TX01_01";

new ToogleText("CB01_01", "TX01_01");