[JS] Actie als er geen Checkbox geselecteerd is... - Softwareontwikkeling

woensdag 16 mei 2007 15:46

Acties:

Verwijderd

Topicstarter

Ik heb een form gemaakt die een inputfield heeft en 3 checkboxen.
Default staan de 3 checkboxen geselecteerd, maar de gebruiker kan dit aanpassen om zijn zoekresultaten te verkleinen.
MAAR er zou een JS actie moeten gebeuren als er 0 checkboxen zijn geselecteerd.
Nog een extraatje: Ik zou deze test graag doen iedere keer als een checkbox veranderd. Op deze manier zijn de gebruikers gewaarschuwd alvorens ze op de submit-knop hebben geklikt...

Heb hierachter gegoogled, en hetvolgende gevonden, maar spijtig genoeg werkt deze methode niet...

code:

var checkFound = false;
for (var counter=0; counter < myForm.length; counter++) {
   if ((myForm.elements[counter].name == "myCheckbox") && (myForm.elements[counter].checked == true)) {
      checkFound = true;
      }
   }
if (checkFound != true) {
   alert ("Please check at least one checkbox.");
   }

Iemand nog enige voorstellen?

Bedankt!

woensdag 16 mei 2007 17:15

Acties:

Verwijderd

Topicstarter

Ok, op Msn heeft men mij al verdergeholpen! (Hartelijk bedankt Jano!)

De oplossing:

code:

<html>
<head>
<title>Blablabla</title>
<script>

function check() {
    var verkoop = document.getElementById("zoeken-verkoop").checked;
    var verhuur = document.getElementById("zoeken-verhuur").checked;
    var fotos = document.getElementById("zoeken-fotos").checked;

    if (!verkoop && !verhuur && !fotos) {
        alert("U hebt geen vinkjes aangeduid");
    }
}

</script>
</head>

<body>
<h1>Test</h1>
<form onsubmit="check()">
<p>
<input type="checkbox" name="zoekenverkoop" id="zoeken-verkoop" checked="checked" onchange="check()" /> Bla <br />
<input type="checkbox" name="zoekenverhuur" id="zoeken-verhuur" checked="checked" onchange="check()" /> Bla <br />
<input type="checkbox" name="zoekenfotos" id="zoeken-fotos" checked="checked" onchange="check()" /> Bla <br />
<input type="submit" name="submit" value="Zoeken" />
</p>
</form>
</body>
</html>

Reageer