0 votes
in SoSci Survey (dt.) by s081199 (160 points)

Hallo,
ich bin blutiger Anfänger bei HTML/PHP/JavaScript. Alles neu für mich. Bisher hat´s gut geklappt aber jetzt bei JavaScript steh ich komplett an und brauche bitte Hilfe!

Ich frage in meinem Fragebogen verschiedene Smartphone-Inhalte ab. Zu einem Inhalt gibt es jeweils drei Fragen mit dem Fragentyp "Skala (Extrema beschriftet)" (ging leider nicht mit Items, weil sich hierbei die Skalenendpunkte jeweils unterscheiden).

Wünschenswert wäre, wenn bei Frage 1 "Nutzung dieses Inhalts...kommt vor", nie=1 oder weiß nicht=-1 (wie ist das mit nicht beantwortet=-9?) kommt, dass man dann die folgenden zwei Fragen/Skalen (empfinde ich als störend UND führt zum Streit) nicht ausfüllen kann.
Filterfragen kommen für mich nicht in Frage, weil die drei zusammengehörenden Fragen auf einer Seite angezeigt werden sollen.

Ich habe mich an den Text "Fragen bei Auswahl einer bestimmten Option sofort einblenden" gehalten und versucht das zu adaptieren. Leider gibt es kein Beispiel für eine Skala. Hoffe das geht überhaupt.

<script type="text/javascript">
<!--
var optionA = document.getElementById("IH01_011");  // 1 = kommt nie vor
var optionB = document.getElementById("IH01_012");  // 2
var optionC = document.getElementById("IH01_013");  // 3
var optionD = document.getElementById("IH01_014");  // 4
var optionE = document.getElementById("IH01_015");  // 5 = kommt ständig vor
var optionF = document.getElementById("IH01_01DK");  // -1 = weiß nicht
var frage1 = document.getElementById("IE01_qst");  // Frage...empfinde ich als störend
var frage2 = document.getElementById("IS01_qst");  // Frage...führt zum Streit
 
function toogle() {
  if ((optionB.checked) || (optionC.checked) || (optionD.checked) || (optionE.checked)) {
    // Wurde Option B, C, D oder E ausgewählt, dann wird die Frage angezeigt
    // Keine Angabe ("") verwendet die Standard-Einstellung (normal anzeigen)
    frage1.style.display = "";
  } else {
    // Mit der Anzeigeoption "none" wird die Frage ausgeblendet
    frage1.style.display = "none";
  }
}
 
// Die Funktion soll jedesmal ausgeführt werden, wenn eine der vier Optionen angeklickt wird
SoSciTools.attachEvent(optionB, "click", toogle);
SoSciTools.attachEvent(optionC, "click", toogle);
SoSciTools.attachEvent(optionD, "click", toogle);
SoSciTools.attachEvent(optionE, "click", toogle);

// Und jetzt gleich soll sie auch ausgeführt werden, damit die Anzeige zu Beginn korrekt ist
// (z.B. ausblenden der Texteingabe zu Beginn)
toogle();
// -->
</script>

Hier habe ich es jetzt nur mit Ausblenden von Frage1 probiert. Eigentlich sollen Frage 1 und Frage 2 ausgeblendet werden. Aber ersteres funktioniert schon nicht...

Bin ich das ganze komplett falsch angegangen (z.B. Bezeichnung mit option)? Was ich auch versucht habe, ist das mit der JavaScript-Fehlersuche im Browser, was hier im Forum schon empfohlen wurde. Hierbei erhalte ich: SyntaxError: expected expression, got '<'
Weiß damit leider nicht wirklich was anzufangen, da ich alle <>mit der Beschreibung abgeglichen habe. ist die vorletzte Zeile im Script vielleicht Schuld wegen den //?

Ich war mir auch sehr unsicher ob man die einzelnen Antwortalternativen bei der Frage selbst anführen soll (=so wie jetzt im Script) oder die HTML-ID der Frage selbst und dann die einzelnen Werte mit value=1... Hat so aber auch nicht funktioniert...

Den Textbaustein mit JavaScript habe ich auf der entsprechenden Seite unter den ersten zwei Fragen eingefügt.

Hier also mein großes HILFE! Vielen Dank schon mal!!!

1 Answer

+1 vote
by SoSci Survey (328k points)
selected by s081199
 
Best answer

Der Code sieht schonmal nicht schlecht aus. Die einzelnen Auswahlfelder der Skala funktionieren technisch genauso wie Auswahloptionen einer Auswahlfrage - insofern passt das alles. Die Bezeichnungen der Variablen (option...) können frei gewählt werden.

Was ich auch versucht habe, ist das mit der JavaScript-Fehlersuche im
Browser, was hier im Forum schon empfohlen wurde. Hierbei erhalte ich:
SyntaxError: expected expression, got '<'

Sehr gut, das ist schonmal der richtige Weg! Jetzt müssten wir noch herausfinden, auf welche Zeile sich die Fehlermeldung bezieht. Können Sie die Fehlermeldung oder die Zeilennummer in der Fehlerkonsole vielleicht anklicken? Wenn nicht, möchten Sie es vielleicht einmal im Firefox versuchen?

Ich sehe im JavaScript-Code keine spitze Klammer - und das // --> am Ende ist auch korrekt. Es schließt den HTML-Kommentar, der am Anfang startet mit <!--, kommentiert die Zeile aber zugleich für JavaScript aus (//). Was ich mir vorstellen könnte ist, dass dieses JavaScript in einem anderen JavaScript steht, also ein voriges <script...> nicht durch </script> abgeschlossen wurde.

Sie können auch gerne einen Pretest-Link direkt (!) zur betroffenen Fragebogen-Seite als Kommentar unter Ihre Frage posten, dann können wir uns das Ergebnis live ansehen.

Zur zweiten Frage

Um nicht nur Frage 1 ein/auszublenden, sondern auch Frage 2, muss einfach in jedem teil des Filters noch eine Zeile ergänzt werden:

function toogle() {
  if ((optionB.checked) || (optionC.checked) || (optionD.checked) || (optionE.checked)) {
    frage1.style.display = "";
    frage2.style.display = "";  // Ergänzung
  } else {
    frage1.style.display = "none";
    frage2.style.display = "none";  // Ergänzung
  }
}
by s081199 (160 points)
edited by s081199
Danke für die super schnelle Antwort!
Bei der JavaScript-Fehlersuche stehe ich leider komplett an. Habs zuvor schon bei Firefox versucht und jetzt auch noch im Internet Explorer. Habe das ganze Script in die Konsole kopiert. Weiß nicht wie ich sehen sollte in welcher Zeile der Fehler ist. Wenn ich die Zeilen einzeln kopiere, schreibt er mir den gleichen SyntaxError schon bei der ersten Zeile!...kA
Hab dafür jetzt das Script wie oben gepostet, kopiert.

Gut jetzt weiß ich also auch wie das mit dem Pretest funktioniert. Wäre nur schön, wenn der Link danach gelöscht werden könnte!? Der Fragebogen ist noch nicht fertig. Das beschriebene Problem zeigt sich auf Seite 7 (Inhalte)
by SoSci Survey (328k points)
Bitte posten Sie doch einen Pretest-Link direkt (!) zur Seite 7 - dann brauche ich mich nicht durch 6 Seiten mit Antwortpflicht klicken. Danke.

Den Link oben können Sie jederzeit durch Editieren Ihres Kommentars entfernen.
by s081199 (160 points)
edited by s081199
Entschuldigen Sie bitte vielmals die Umstände. Diese Möglichkeit habe ich gar nicht wahrgenommen. Hier der neue Pretest-Link ab S. 7:
by SoSci Survey (328k points)
Oha ... bei mir beschwert sich Firefox über ein "missing ( before condition" - und zeigt auch den Quelltext dazu:

function toogle() {
  if <span class="S2Tooltip anchor marker">optionB.checked) </span><span class="S2Tooltip container"><span class="S2Tooltip tiptext rounded shadow">| (optionC.checked) || (optionD.checked) || (optionE.checked</span></span> {
    // Wurde Option B, C, D oder E ausgewählt, dann wird die Frage angezeigt
    // Keine Angabe ("") verwendet die Standard-Einstellung (normal anzeigen)
    frage1.style.display = "";
  } else {
    // Mit der Anzeigeoption "none" wird die Frage ausgeblendet
    frage1.style.display = "none";
  }
}

Nein, das ist nicht genau das, was Sie geschrieben hatten - das ist eine unbeabsichtigte Nebenwirkung hiervon: https://www.soscisurvey.de/help/doku.php/de:create:popup

Die Lösung ist zum Glück denkbar einfach: Lassen Sie bitte erstmal die zusätzlichen Klammern um die optionX.checked weg:

if (optionB.checked || optionC.checked || optionD.checked || optionE.checked) {

Ich notiere derweilen auf der Wunschliste von SoSci Survey, dass hier nicht versehentlich die Erkennung für die Wiki-Notation für PopUps anspricht...
by s081199 (160 points)
Wow super! Ohne die Klammern funktioniert es!
Wirklich sinnvoll wird es jetzt dann wenn ich in den Code noch irgendwie frage 2 reinbringe. Habe jetzt diverse Variationen mit dem && eingebaut. Ich bekomms leider nicht hin. Also bei B,C,D oder E-->Frage 1 und Frage 2 anzeigen.
Muss ich das als eigene Funktion in eigenem Script formulieren?
Und wenn das dann klappen sollte, kann ich alle "Befehle" (oder wie man das nennt) in einen Textbaustein geben oder soll ich nach jedem dreier Fragenblock einen Textbaustein dazu formulieren?
Vielen Dank für die tolle und rasche Hilfe!
by SoSci Survey (328k points)
Nichts leichter als das ... ich habe die Antwort oben noch entsprechend ergänzt.
by s081199 (160 points)
edited by s081199
Cool! Danke fürs ergänzen!
Bis jetzt hat alles toll geklappt jetzt kommen wir zur Bonusaufgabe. ;)

Momentan ist es so eingestellt, dass wenn ich auf "nie" oder "weiß nicht" klicke nichts aufgeht und wenn ich auf die übrigen Optionen klicke die nächsten zwei Fragen dazu aufgehen.

Was in diesem Zusammenhang jetzt noch spitze wäre: Wenn ich zuvor auf z.B. "ständig" klicke und die nächsten zwei Fragen erscheinen, mich dann aber umentscheide und auf "nie" klicke, dass die nächsten zwei Fragen wieder verschwinden. Ich somit mit der Antwort "nie" niemals die Möglichkeit habe, die zwei kommenden Fragen zu beantworten. Selbiges gilt für "weiß nicht".
Dürfte ich da nochmal um Hilfe bitten?

Hier mein aktueller Pretest-Link:
by SoSci Survey (328k points)
Um das zuerreichen, müssten Sie das SoSciTools.attachEvent() einfach für alle Eingabefelder (optionA bis optionF) aufrufen, nicht nur für B bis E. Diese Zeilen sind nur dafür verantwortlich, dass die Funktino toogle() aufgerufen wird - diese kümmert sich dann darum, ob die Fragen ein- oder ausgeblendet werden sollen.
by s081199 (160 points)
Sie sind echt der Wahnsinn! Vielen Dank!!!!!

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

...