Checkboxen überprüfen

[molily]

<form name="formular" action="">
  <input type="checkbox" name="box" value="1" /> 1 <br />
  <input type="checkbox" name="box" value="2" /> 2 <br />
  <input type="checkbox" name="box" value="3" /> 3 <br />
  <input type="button" onClick="[code lang=javascript]var j=0;for(i=0;i<3;i++) { if(document.formular.box[i].checked == true){j++;};};if(j<1){alert('Nichts markiert!')}else{document.formular.submit()};

> </form>[/code]  
  
Das ist nicht so elegant gelöst.  
  
Erstmal eine Trennung von sinnvollem HTML und JavaScript:  
  
~~~html
<form name="formular" action="">  
<ol>  
<li><label><input type="checkbox" name="box[]" value="1" /> 1</label></li>  
...  
</ol>  
<p><input type="submit" value="Überprüfen" /></p>  
</form>

Die Darstellung kannst du beliebig mit CSS modifizieren.

Die JavaScript-Logik fügst du am besten mit JavaScript beim onload hinzu:

window.onload = function () {  
   document.forms.formular.onsubmit = formularÜberprüfung;  
};  
function formularÜberprüfung () { ... }

Das Formular bekommt dann einen ganz normalen Submitbutton ohne onclick-Attribut. Beim Absenden des Formulars wird automatisch der submit-Handler aufgerufen.

formularÜberprüfung durchläuft die Checkboxen mit name="box[]" und prüft, ob eines davon checked ist:

var checkboxes = document.forms.formular.elements["box[]"];  
var checked = false;  
for (var i = 0, checkbox; checkbox = checkboxes[i]; i++) {  
   if (checkbox.checked) {  
      checked = true;  
   }  
}  
if (!checked) {  
   window.alert("Fehler!");  
   return false;  
}

Wenn nicht, dann gibt es eine Fehlermeldung aus und verhindert das Absenden des Formulars.

Mathias