Filterfrage erscheint nicht wieder.

Question

In meinem Fragebogen funktioniert der Filter 3.7 und 3.11 nicht. Wenn sich da eine Person verklickt, und ausversehen die Option anwählt, die das ausblenden der Frage aktiviert, kommt beim zurückklicken nicht die Frage, die eigentlich erscheinen sollte.
https://www.soscisurvey.de/test397003/?act=u6z7oSVWDvm9go7T6UeANEfF

Comments

Bitte ersetzen Sie in Ihrer Frage die Nummern durch die SoSci-Kennungen der Fragen und ergänzen sie noch den relevanten JavaScript-Code. Danke.

Im Zweifelsfall sollten SIe sich für Ein- oder (!) Ausblenden entscheiden. Beides zu mischen wird immer mal wieder zu Fehlern führen. Es sollte pro gefilterter Frage auch nur ein Script geben - sonst gibt es eine sog. "race condition", wo abhängig von externen Faktoren wie z.B. der Reihenfolge entweder der eine oder der andere Filter aktiv wird.

---

Es geht um die Fragen T308 und T312.

T308:

<script type="text/javascript">
// <!--
function DynamicFilter(auswahlIDT308, frageIDT310, frageIDT309, frageIDT311) {
    this.option4 = document.getElementById(auswahlIDT308 + "_04a");
    this.option5 = document.getElementById(auswahlIDT308 + "_05a");
    this.frageT310 = document.getElementById(frageIDT310 + "_qst");
    this.frageT309 = document.getElementById(frageIDT309 + "_qst");
    this.frageT311 = document.getElementById(frageIDT311 + "_qst");

    var that = this;

    this.toggle = function() {
        if (that.option4.checked || that.option5.checked) {
            that.frageT310.style.display = "none";
            that.frageT309.style.display = "none";
            that.frageT311.style.display = "none";
        } else {
            that.frageT310.style.display = "";
            that.frageT309.style.display = "";
            that.frageT311.style.display = "";
        }
    }

    SoSciTools.attachEvent(this.option4, "click", this.toggle);
    SoSciTools.attachEvent(this.option5, "click", this.toggle);

    this.toggle();
}

new DynamicFilter("T308", "T310", "T309", "T311");
// -->
</script>

T312:

<script type="text/javascript">
// <!--
function DynamicFilterT312(auswahlIDT312, frageIDT313) {
    this.option1 = document.getElementById(auswahlIDT312 + "_01a"); // Option 1
    this.option3 = document.getElementById(auswahlIDT312 + "_03a"); // Option 3
    this.frageT313 = document.getElementById(frageIDT313 + "_qst"); // Frage T313

    var that = this;

    this.toggle = function() {
        if (that.option1.checked || that.option3.checked) {
            that.frageT313.style.display = "none"; // Frage T313 ausblenden
        } else {
            that.frageT313.style.display = ""; // Frage T313 anzeigen
        }
    }

    SoSciTools.attachEvent(this.option1, "click", this.toggle);
    SoSciTools.attachEvent(this.option3, "click", this.toggle);

    this.toggle();
}

new DynamicFilterT312("T312", "T313");
// -->
</script>

---

Danke für den aktuellen Code. Ihr Code blendet Fragen explizit aus, wenn bestimmte Optionen ausgewählt werden. Ich verstehe Ihre Frage aber so, dass Sie das nicht (immer) möchten.

Bitte beschreiben Sie nochmal genau (mit SoSci-Kennungen und ggf. den Nummern der entsprechenden Optionen), unter welcher Bedingung eine Folgefrage ausgeblendet wird, wenn sie eigentlich angezeigt werden sollte?

---

Wenn bei T308 eine der ersten 3 Optionen ausgewählt wurde, dann sollen die Fragen T309, T310 und T311 eingeblendet werden. Ansonsten nicht.

Wenn bei T312 die 2. Option ausgewählt wurde, dann soll 313 erscheinen. Sonst nicht.

Answer 1

Wenn bei T308 eine der ersten 3 Optionen ausgewählt wurde, dann sollen die Fragen T309, T310 und T311 eingeblendet werden. Ansonsten nicht.

Gut, damit kommen wir weiter. Nehmen wir als Basis Ihren Code von oben, bzw. folgenden Ausschnitt:

    if (that.option4.checked || that.option5.checked) {
        that.frageT310.style.display = "none";
        that.frageT309.style.display = "none";
        that.frageT311.style.display = "none";
    } else {
        that.frageT310.style.display = "";
        that.frageT309.style.display = "";
        that.frageT311.style.display = "";
    }

Das besagt, wann die Fragen ausgeblendet werden müssen. Nur wenn sie nicht ausgeblendet werden, sind sie (dieser Logik zufolge) sichtbar.

Jetzt müssen Sie die Logik nur noch so umdrehen, wie Sie es im Text geschrieben haben:

    if (that.option1.checked || that.option2.checked || that.option2.checked) {
        that.frageT310.style.display = "";
        that.frageT309.style.display = "";
        that.frageT311.style.display = "";
    } else {
        that.frageT310.style.display = "none";
        that.frageT309.style.display = "none";
        that.frageT311.style.display = "none";
    }

Comments

Danke, das habe ich gemacht, aber leider ist es immer noch so, dass die Frage nicht wieder eingeblendet wird, wenn ich erst bspw. Option 4 und dann Option 3 auswähle.

---

Das liegt daran, dass Sie in Ihrem Code oben nur die Klicks auf die Optionen 4 und 5 überwachen:

    SoSciTools.attachEvent(this.option4, "click", this.toggle);
    SoSciTools.attachEvent(this.option5, "click", this.toggle);

Die interessieren den Code eigentlich nicht, hier müssten Sie stattdessen die Optionen 1-3 überwachen.

---

Das habe ich bereits mit dem neuen Script so eingefügt, aber das funktioniert trotzdem nicht:

<script type="text/javascript">
// <!--
function DynamicFilter(auswahlIDT308, frageIDT310, frageIDT309, frageIDT311) {
    this.option1 = document.getElementById(auswahlIDT308 + "_01a");
    this.option2 = document.getElementById(auswahlIDT308 + "_02a");
    this.option3 = document.getElementById(auswahlIDT308 + "_03a");
    this.frageT310 = document.getElementById(frageIDT310 + "_qst");
    this.frageT309 = document.getElementById(frageIDT309 + "_qst");
    this.frageT311 = document.getElementById(frageIDT311 + "_qst");

    var that = this;

    this.toggle = function() {
        if (that.option1.checked || that.option2.checked || that.option3.checked) {
            that.frageT310.style.display = "";
            that.frageT309.style.display = "";
            that.frageT311.style.display = "";
        } else {
            that.frageT310.style.display = "none";
            that.frageT309.style.display = "none";
            that.frageT311.style.display = "none";
        }
    }

    SoSciTools.attachEvent(this.option1, "click", this.toggle);
    SoSciTools.attachEvent(this.option2, "click", this.toggle);
    SoSciTools.attachEvent(this.option3, "click", this.toggle);

    this.toggle();
}

new DynamicFilter("T308", "T310", "T309", "T311");
// -->
</script>

---

Ich habe den Pretest-Link von oben nochmal aufgerufen. Sie haben nun alle 5 Optionen in den Code aufgenommen (gut) und es scheint zu funktionieren. Lediglich die Nummerierung der Fragen ist an der Stelle ein wenig kontraproduktiv...