Javascript Snippet: Senden-Button erst aktivieren, wenn eine bestimmte Checkbox angeklickt ist

cross 5651794 1920

In diesem Fall sollte es explizit kein jQuery sein, sondern eine davon unabhängige einfache Javascriptlösung.

Es handelte sich um ein bestehendes Webformular, bei dem die Checkbox keine ID, nur einen Namen hatte. Und unter einem Namen kann es in Formularen mehrere Checkboxen geben. Mit getElementsByName (oder getElementsByClassName) bekommt man also ein Array zurück, während getElementById ein einzelnes Element zurückgibt (ID kann es nur eine geben).

Sofern die Checkbox eine ID hat, wird das Snippet eine Zeile kürzer.

Der Status der Checkbox sollte bereits vor jedwedem Event geprüft werden, da sie z.B. nach einem Refresh je nach Browser durchaus schon mal angeklickt sein kann. In diesem Fall soll der Button funktionieren, im anderen nicht.

Javascript brauche ich nicht so oft wie PHP, daher schaue ich mich bei neuen Aufgabenstellung erstmal immer um, bevor ich mich an die Arbeit mache. Interessanterweise war es für diese vergleichsweise Anforderung gar nicht so einfach, einen funktionierenden Ansatz aufzutreiben, oder einen, der umfassend war, also auch die Situation einbezog, in der noch kein Event stattgefunden hatte.

var submit = document.getElementById("sendbutton"); var checker = document.getElementsByName("consent"); var checkbox = checker[0]; if ( checkbox.checked ) { submit.disabled = false; } else { submit.disabled = true; } checkbox.onclick = function () { if ( checkbox.checked ) { submit.disabled = false; } else { submit.disabled = true; } };
Code-Sprache: JavaScript (javascript)

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht.