0 votes
in SoSci Survey (dt.) by s120134 (180 points)
edited by SoSci Survey

Sehr geehrtes Team von SoSci Survey,

vielen lieben Dank, dass ich Ihr Tool für meine Forschung an der Universität Leipzig nutzen darf!

Das Folgende würde ich gern abbilden:

Frage VU03:
Haben Sie sich zuvor bereits mit Versicherungen beschäftigt oder sie gar abgeschlossen?

Wenn ja (Variable 01), weiter zu Frage VU04.

Wenn nein (Variable 02), weiter zu Frage VU08.


Von Frage VU04 = Haben Sie schon einmal eine Reiseversicherung abgeschlossen?
Wenn ja, weiter zu Frage VU16.
VU16 = Was umfasste Ihre letzte Reiseversicherung?
Wenn nein, weiter zu Frage VU06.
VU06 = Würden Sie es bei einer Ihrer nächsten Reisen in Erwägung ziehen?


Wenn VU03 mit ja beantwortet wurde und alles um die folgende VU04 beantwortet wurde, sollen beide die Frage VU07 = Welche weiteren Arten von Versicherungen haben sie bereits genutzt oder nutzen sie noch? gestellt bekommen. Danach geht es dann auch für sie weiter mit Frage VU08.

Ich habe heut 12 Stunden versucht, diese Variante auf der selben Seite hinzubekommen und habe mir die Hilfestellungen durchgelesen. Anhand derer habe ich zuerst einmal einen Textbaustein mit Format HTML Code wie folgt angelegt:

<script type= text/javascript">
<!--
var optionA = document.getElementByID("VU03_01");
var optionB = document.getElementByID("VU03_02");
var frage = document.getElementByID("VU04_qst");

function toogle() {
  
  if ((optionA.checked)) {
    
    frage.style.display = "";
  } else {
    frage.style.display = "none";
  }
}

SoSciTools.attachEvent(optionA, "click", toogle);
SoSciTools.attachEvent(optionB, "click", toogle);
 
toogle();
// -->
</script>

Diesen habe ich unter die Fragen VU03 und VU04 auf meiner Fragebogenseite gesetzt. Frage VU04 muss dabei zwar dringend beantwortet werden, aber ich habe sie erstmal auf "muss nicht beantwortet werden gestellt", da ich gelesen habe, das Fragen für das dynamische Ein- und Ausblenden "unsichtbar" sein müssen.

So wollte ich das für alle Filterfragen machen. Leider hat es aber schon hier im ersten Schritt nicht funktioniert und daher komme ich einfach nicht weiter.

Ich würde mich über Ihre Hilfe sehr, sehr freuen! Vielen lieben Dank schon einmal vorweg!

Mit freundlichen Grüßen,

Michèle Geisler

PS. Für die Antwortpflicht habe ich schon Folgendes gefunden:

Die Antwortpflicht verträgt sich nicht mit dem dynamischen Ein-/Ausblenden via JavaScript. Aber es gibt eine andere Lösung. Deaktivieren Sie zunächst die Antwortpflicht für die Frage. Dann platzieren Sie auf der folgenden Seite (!) ein paar Zeilen PHP-Code, welche überprüfen, ob "ja" angekreuzt und die zweite Frage beantwortet wurde. Wenn nicht, schicken Sie den Teilnehmer mittels repeatPage() zur vorigen Seite, s. Individuelle Antwort-Prüfung.

if ((value('AB01') == 2) and (value('AB02') < 1)) {
  markFail('AB02');
  repeatPage('fehlertext-ID');
}
by SoSci Survey (302k points)
ich bin nicht sicher, was genau Ihre Frage ist. Es sind da seeehr viele Frage-Kennungen in Ihrer Frage :)

Fangen wir doch mal mit dem ersten an, was nicht funktioniert. Also, ich habe verstanden, dass Sie eine Frage auf derselben Frage ein-/ausblenden möchten. Schreiben Sie mir doch bitte nochmal kurz: Was ist hier die Filterfrage (VU03?) und welche Frage soll ein- oder ausgeblendet werden (VU04?)?
by s120134 (180 points)
Genau, die erste Filterfrage ist Frage VU03, die bei der Antwort (anklicken) "ja" zu Frage VU04 führen soll und bei "nein" zu Frage VU08 - also die Folgefrage nach anklicken der Antwort auf der selben Seite erscheinen lassen soll.

Und das sozusagen für die folgenden Filterfragen und daraus folgenden Folgefragen genauso.

Danke für Ihre Hilfe. Soll ich Ihnen ansonsten irgendeinen Zugang zu meinem Bogen senden, mit Hilfe dessen Sie genau hineinschauen können?

Liebe Grüße!
by SoSci Survey (302k points)
> Genau, die erste Filterfrage ist Frage VU03, die bei der Antwort (anklicken) "ja" zu Frage VU04 führen soll

Okay, dann ist der von Ihnen gepostete JavaScipt-Code auf jeden Fall schonmal auf dem richtigen Weg.

Als nächstes müssen wir herausfinden, warum er nicht funktioniert. Dafür müssten Sie einen Blick in die JavaScript-Konsole Ihres Browsers werfen. Posten Sie gerne auch einen Pretest-Link direkt (!) zur betroffenen Seite, dann kann ich es mir auch ansehen.
by s120134 (180 points)
Also ich bin jetzt in den Textbaustein gegangen, indem der Java Code als HTML Code Format drin steht. Dann habe ich mir dort die JavaScript Konsole anzeigen lassen (Safari), diese ist jedoch leer. Leider kenn ich mich damit gar nicht aus. Welche Erkenntnisse soll ich daraus ziehen?

Pretest Link
https://www.soscisurvey.de/versicherungsentscheidungen2019/?act=V5TsdmcmLKVwfHDusBNcojQO
by SoSci Survey (302k points)
Bitte starten Sie im Browser den Fragebogen (auf der Seite mit dem JavaScript-Code) und öffnen Sie dort die Fehlerkonsole. Im Moment ist das allerdings noch nicht nötig, denn die Konsole zeigt nichts.

Bei der Kontrolle, ob der JavaScript-Code überhaupt in der Seite eingebunden ist, sah ich allerdings eine Warnung des Browsers, dass ein Anführungszeichen fehlt:

<script type= text/javascript">

Und zwar zwischen dem type= und dem text/javascript. Wenn Das korrigiert ist, geht es weiter mit der Fehlersuche.
by s120134 (180 points)
Danke für Ihre unermüdliche Hilfe!

Ich habe den Fehler korrigiert und nun zeigt die Konsole:
TypeError: document.getElementByID is not a function. (In 'document.getElementByID("VU03_1")', 'document.getElementByID' is undefined)
by SoSci Survey (302k points)
> getElementByID is not a function

Ja, JavaScript ist ein wenig kleinlich, wenn es um Groß- und Kleinschreibung geht. Korrekt muss es heißen:

getElementById() mit kleinem "D" am Ende.
by s120134 (180 points)
Nun zeigt mir die Konsole leider an:

Error: No element specified for SoSciTools.attachEvent()

Die sind doch aber beide mit Option A und B spezifiziert? :(
by SoSci Survey (302k points)
Was JavaScript eigentlich sagen möchte: Die Variable optionA ist leer. Und warum? Weil getElementById() kein passendes Element gefunden hat. Und warum? Sie haben die Kennung "VU03_1" eingetragen, tatsächlich ist die HTML-ID des Auswahlfelds aber "VU03_01a".

Ja, es ist leider wenig wenig müßig ... aber wir sind auf einem guten Weg :)
by s120134 (180 points)
Oh okay, ich hatte es extra auf 1 und 2 umbenannt, weil ich dachte, die Variablen in der Frage so genannt zu haben.
Ich habe es nun wie folgt geändert:

<script type = "text/javascript">
<!--
var optionA = document.getElementById("VU03_1a");
var optionB = document.getElementById("VU03_2a");
var frage = document.getElementById("VU04_qst");

function toogle() {
  
  if ((optionA.checked)) {
    
    frage.style.display = "";
  } else {
    frage.style.display = "none";
  }
}

SoSciTools.attachEvent(optionA, "click", toogle);
SoSciTools.attachEvent(optionB, "click", toogle);
 
toogle();
// -->
</script>

Und nun zeigt die Konsole:
Error: No element specified for SoSciTools.attachEvent()
by SoSci Survey (302k points)
Es ist _01a, nicht _1a
by s120134 (180 points)
Oh wie wunderbar! Vielen lieben Dank! Das hat jetzt schon einmal geklappt :) Total das Glücksgefühl gerade :D

Nun würde ich gern auf der selben Seite weitermachen mit:
Von Frage VU04 = Haben Sie schon einmal eine Reiseversicherung abgeschlossen?
Wenn ja, weiter zu Frage VU16.
VU16 = Was umfasste Ihre letzte Reiseversicherung?
Wenn nein, weiter zu Frage VU06.
VU06 = Würden Sie es bei einer Ihrer nächsten Reisen in Erwägung ziehen?

Dazu habe ich diese beiden Fragen unter unseren Java Code von vorhin gezogen und danach einen zweiten Java Code eingefügt:

<script type = "text/javascript">
<!--
var optionA = document.getElementById("VU04_01a");
var optionB = document.getElementById("VU04_02a");
var frageA = document.getElementById("VU16_qst");
var frageB = document.getElementById("VU06_qst");

function toogle() {
  
  if ((optionA.checked)) {
    
    frage.style.display = "VU16_qst";
  } else {
    frage.style.display = "VU06_qst";
  }
}

SoSciTools.attachEvent(optionA, "click", toogle);
SoSciTools.attachEvent(optionB, "click", toogle);
 
toogle();
// -->
</script>

Die Java Konsole zeigt nichts an, aber mit dem Eingefügten geht dann weder, was wir (besser Sie) gerade hingekriegt haben, noch die weitere Führung. Wahrscheinlich auch, weil unter Frage VU04 noch der andere Java Code steht.

Hier wäre der neue Pretestlink der entsprechenden Seite:

https://www.soscisurvey.de/versicherungsentscheidungen2019/?act=5bqq27ymXbBa2UjYAP3KcgIv
by SoSci Survey (302k points)
Wenn Sie neue Optionen ansprechen möchten, dann verwenden Sie dafür bitte neue Variablennamen. Sonst überschreiben Sie hier die Variable `optionA`, die Sie weiter oben definiert haben. Auch die Funktion toogle() muss anders heißen. Also z.B.

var optionVU04A = document.getElementById("VU04_01a");
var optionVU04B = document.getElementById("VU04_02a");
var frageVU04A = document.getElementById("VU16_qst");
var frageVU04B = document.getElementById("VU06_qst");

function toogleVU04() {
    if ((optionVU04A.checked)) {
        frageVU04A.style.display = "";
        frageVU04B.style.display = "none";
  } else {
        frageVU04A.style.display = "none";
        frageVU04B.style.display = "";
  }
}

SoSciTools.attachEvent(optionVU04A, "click", toogleVU04);
SoSciTools.attachEvent(optionVU04B, "click", toogleVU04);
toogleVU04();

Beim Anzeigen/Ausblenden war das mit dem .display auch noch nicht ganz korrekt (s. oben).
by s120134 (180 points)
Ach Gott natürlich, bitte entschuldigen Sie. Ich bin bislang davon ausgegangen, dass in der Klammer hinten die Optionen definiert werden, aber so wie Sie sagen, macht es natürlich mehr Sinn und funktioniert.

Was ich mich nur frage, warum Frage VU06 schon von Anfang an angezeigt wird? Muss ich die Frage vielleicht im ersten Javacode zuvor als nicht einzublenden definieren? Sie verschwindet nämlich erst, wenn man bei Frage VU04 ankommt und nein drückt.
by SoSci Survey (302k points)
> Was ich mich nur frage, warum Frage VU06 schon von Anfang an angezeigt wird?

Die Funktion toogleVU04() kennt nur zwei Zustände: Entweder ist Option A ausgewäählt oder nicht. Wenn nicht (das ist zu Beginn der Fall), dann wird die Frage B gezeigt.

Sie könnten stattdessen auch einzeln prüfen, was angeklickt ist:


function toogleVU04() {
    frageVU04A.style.display = "none";
    frageVU04B.style.display = "none";
    if (optionVU04A.checked) {
        frageVU04A.style.display = "";
    }
    if (optionVU04B.checked) {
        frageVU04B.style.display = "";
    }
}
by SoSci Survey (302k points)
Das display = "none" blendet die Frage erstmal aus. Das display = "" zeigt sie an. Nicht ganz intuitiv, aber zielführend :)
by s120134 (180 points)
Tausend Dank!
by s120134 (180 points)
Eine allerletzte Frage:

Nach diesen ganzen Programmierungen und Filterfragen ist die Nummerierung der Fragen nun nicht mehr korrekt. Händisch kann ich sie leider nicht ändern, da nach einigen Filtern die Fragen zum Schluss wieder zusammenführen. Können Sie mir bitte helfen?
by SoSci Survey (302k points)
Die Nummerierung passt dann nicht, wenn ausgeblendete Fragen eine Nummer bekommen. Ich empfehle, die Nummerierung für die Fragen, die Sie per JavaScript ein/ausblenden, einfach in der Frage abzuschalten.

Wenn Sie das nicht möchten, wird es ein klein wenig komplizierter. Dann müssten Sie mit Texten (Rukrik -> Neuer Text) arbeiten, die eine Nummer anzeigen. Und diese müssten mittels Filter auf der Folgeseite unsichtbar eingebunden werden.

1 Answer

0 votes
by SoSci Survey (302k points)

Mit den Korrekturen scheint es im ersten Schritt schonmal zu funktionieren. Glückwunsch :)

Nebst der Fehlerkonsole ist auch der "Inspektor" in den Entwickler.Tools sehr hilfreich. Damit kann man ein Formularelement (z.B. ein Auswahlfeld) einfach anklicken und einfach nachsehen, welche HTML-ID es hat.

Willkommen im Online-Support von SoSci Survey.

Hier bekommen Sie schnelle und fundierte Antworten von anderen Projektleitern und direkt von SoSci Survey.

→ Eine Frage stellen


Welcome to the SoSci Survey online support.

Simply ask a question to quickly get answers from other professionals, and directly from SoSci Survey.

→ Ask a Question

...