Hallo Zusammen,
ich habe mehrere Einfach-Auswahl-Fragen auf einer Seite (insgesamt 6 Stück, Variablen heißen SG01-SG06). Ich möchte, dass der Weiter-Button erst auftaucht, wenn alle Fragen beantwortet worden sind. Das ist mein bisheriger Java-Code in Anlehnung an https://www.soscisurvey.de/help/doku.php/de:create:dynamic:
Es funktioniert allerdings nicht - und ich weiß nicht, woran es liegt. Vielleicht haben Sie eine Idee? Ich würde mich sehr freuen!
<script type="text/javascript">
<!--
document.addEventListener("DOMContentLoaded", function() {
// HTML-IDs der Auswahloptionen SG01 bis SG07
var sg01 = document.getElementById("SG01");
var sg02 = document.getElementById("SG02");
var sg03 = document.getElementById("SG03");
var sg04 = document.getElementById("SG04");
var sg05 = document.getElementById("SG05");
var sg06 = document.getElementById("SG06");
var sg07 = document.getElementById("SG07");
// HTML-ID des "Weiter"-Buttons
var weiterButton = document.getElementById("weiter-button");
// Button zu Beginn verstecken
SoSciTools.submitButtonsHide();
function toggleButton() {
// Prüfen, ob alle Checkboxen oder Radiobuttons angeklickt wurden (checked)
if (sg01.checked && sg02.checked && sg03.checked && sg04.checked && sg05.checked && sg06.checked) {
// Wenn alle ausgewählt sind, zeige den "Weiter"-Button an
SoSciTools.submitButtonsShow(); // SoSciTools Funktion, um den Button anzuzeigen
} else {
// Wenn nicht alle ausgewählt sind, verstecke den "Weiter"-Button
SoSciTools.submitButtonsHide();
}
}
// Die Funktion soll jedes Mal ausgeführt werden, wenn eine der Optionen angeklickt wird
sg01.addEventListener("click", toggleButton);
sg02.addEventListener("click", toggleButton);
sg03.addEventListener("click", toggleButton);
sg04.addEventListener("click", toggleButton);
sg05.addEventListener("click", toggleButton);
sg06.addEventListener("click", toggleButton);
// Und jetzt gleich ausführen, um den Button zu Beginn korrekt zu verstecken
toggleButton();
});
// -->
</script>