Zeilen von Skala ausblenden

Question

Ich möchte bei die Zeilen 2-4 einer Skala nur anzeigen, wenn bei der vorherigen Frage eine Zahl > 0 eingegeben wurde (es gibt Honorarkräfte, Angestellte Teilzeit, Angestellte Vollzeit).

Ich versuche es mit dem folgenden JavaScript-Code. Mir fehlt jedoch die HTML-ID, um die ganze Zeile auszublenden. Auch in der Konsole konnte ich keine ID finden (die Zeile scheint keine ID zu haben). Wie kann ich das hinkriegen?

<script type="text/javascript">
<!--
var anzahl1 = document.getElementById("BD04_02");
var anzahl2 = document.getElementById("BD04_03");
var anzahl3 = document.getElementById("BD04_04");
var item1 = document.getElementById("BD05_02");
var item2 = document.getElementById("BD05_03");
var item3 = document.getElementById("BD05_04");

function toggle() {
    if(anzahl1.value > 0){
        item1.style.display = "";
    } else {
        item1.style.display = "none";
    }
    if(anzahl2.value > 0){
        item2.style.display = "";
    } else {
        item2.style.display = "none";
    }
    if(anzahl3.value > 0){
        item3.style.display = "";
    } else {
        item3.style.display = "none";
    }
}
 
// Die Funktion soll jedesmal ausgeführt werden, wenn ein Wert eingegeben wird
SoSciTools.attachEvent(anzahl1, "change", toggle);
SoSciTools.attachEvent(anzahl2, "change", toggle);
SoSciTools.attachEvent(anzahl3, "change", toggle);

// Und jetzt gleich soll sie auch ausgeführt werden, damit die Anzeige zu Beginn korrekt ist
toggle();
// -->
</script>

Answer 1

Wenn Sie für die Skala die Darstellung "dynamisch" auswählen, tragen die <div>-Elemente der Zeilen eine HTML-ID.

Wenn Sie eine Darstellungsvariante verwenden, welche keine ID vergibt: Die JavaScript-Funktion SoSciTools.findContainer() findeet zu einem Element - also zum Beispiel zum Auswahlfeld - das umgebende Element einer bestimmten Klasse.

/**
 * Find a parent node with the specified element name and CSS class.
 * @param {HTMLElement} node
 * @param {String} elName  Search for parent element with this node name (may be null to accept any)
 * @param {String} elClass  Search for parent element with this CSS class (may be null to accept any)
 * @param {String} elAlternative  Search for parent element with this CSS class - and this class is sufficient, even if the name does not match
 * @return HTMLElement|null
 */
SoSciTools.findContainer = function (node, elName, elClass, elAlternative)

Wenn das erste Auswahlfeld der Zeile also z.B. die HTML-ID BD05_021 trägt, und die Zeile durch ein <tr>-Element dargestellt wird, dann können Sie die Zeile wie folgt ermitteln:

var input = document.getElementById("BD05_021");
var row = SoSciTools.findContainer(input, "tr");

Außerdem liefert SoSci Survey eine JavaScript-Schnittstelle für Skalenitems:

var row = s2.BD05.item(2).node;

Beachten Sie bitte, dass diese Funktionen erst nach Laden der Seite verfügbar sind. Sie müssten die Funktion also an ein window.addEventListener("load", ...) koppeln. Noch Fragen? ;)

Comments

Es spricht in meinem Fall bisher nichts gegen die einfachste Lösung, zu einer dynamischen Darstellung zu wechseln. Die Items/Zeilen sind dann zu finden als
document.getElementById("BD05_02_item") usw.
Danke!

Mit findContainer habe ich es auf Anhieb nicht geschafft, etwas Sinnvolleres zu bekommen als
[object HTMLTableRowElement]

---

Dieses HTMLTableRowElement ist genau das Element, das Sie benötigen und welches Sie ggf. ausblenden können. Aber die dynamische Darstellung ist ohnehin eleganter.