michael: Form validieren geht nicht - was kann ich machen?

Hallo,

ich will unten stehende Form mittels JS validieren. Das geht aber leider nur zum Teil. Genaugenommen nur für <Input name="identxyz">. Bei <Input name="array[identxyz]"> klappt es nicht. Leider will ich die Validierung in eine schon bestehende große Seite einbauen bei der es mit array[] gemacht wurde. Hat jemand eine Idee für die richtige JS Syntax? Meine ist wohl fehlerhaft:
if(document.self.cat4[val1].checked == true)???

Ich habe mal eine Beispielseite gebastelt. Bei Checkboxen Categorie 1 und 2 wird in einem Infofeld der Status angezeigt. Z.B. 2 von 3 notwendigen Checkboxen sind angekreuzt. Bei Categorie 3 und 4 klappt die Sache aus oben erwähnten Grund leider nicht ;(

Hat jemand eine Lösung für das Problem?

Hier die HTML:

<!--SCHNIPP-->

<html>
<head>
<script type="text/javascript">
<!--
function check() {
cnt1=0;
if(document.self.cat1_val1.checked == true){
cnt1++;
}
if(document.self.cat1_val2.checked == true){
cnt1++;
}
if(document.self.cat1_val3.checked == true){
cnt1++;
}

cnt2=0;
if(document.self.cat2_val1.checked == true){
cnt2++;
}
if(document.self.cat2_val2.checked == true){
cnt2++;
}
if(document.self.cat2_val3.checked == true){
cnt2++;
}

cnt3=0;
/*
for(i=0; i<3; i++){
if(document.self.cat3[i].checked == true){ cnt3++; }
}
*/

cnt4=0;
/*
if(document.self.cat4[val1].checked == true){ cnt4++; }
if(document.self.cat4[val2].checked == true){ cnt4++; }
if(document.self.cat4[val3].checked == true){ cnt4++; }
*/

document.self.info1.value = cnt1+"/3" + (cnt1==3?" Ok!":" Angaben unvollständig");
document.self.info2.value = cnt2+"/3" + (cnt2==3?" Ok!":" Angaben unvollständig");
document.self.info3.value = cnt3+"/3" + (cnt3==3?" Ok!":" Angaben unvollständig");
document.self.info4.value = cnt4+"/3" + (cnt4==3?" Ok!":" Angaben unvollständig");
}
//-->
</script>
</head>

<body>
<form action="self" name="self" id="n">
<table>
<tr>
<td>categorie 1: </td>
<td><input type="checkbox" name="cat1_val1" value="1" onClick="check()">cat1val1</td>
<td><input type="checkbox" name="cat1_val2" value="1" onClick="check()">cat1val2</td>
<td><input type="checkbox" name="cat1_val3" value="1" onClick="check()">cat1val3</td>
<td><input type="Text" name="info1" value="0/3 Angaben unvollständig" size="30" disabled></td>
</tr>
<tr>
<td>categorie 2: </td>
<td><input type="checkbox" name="cat2_val1" value="1" onClick="check()">cat2val1</td>
<td><input type="checkbox" name="cat2_val2" value="1" onClick="check()">cat2val2</td>
<td><input type="checkbox" name="cat2_val3" value="1" onClick="check()">cat2val3</td>
<td><input type="Text" name="info2" value="0/3 Angaben unvollständig" size="30" disabled></td>
</tr>
<tr>
<td>categorie 3: </td>
<td><input type="checkbox" name="cat3[0]" value="1" onClick="check()">cat3val1</td>
<td><input type="checkbox" name="cat3[1]" value="1" onClick="check()">cat3val2</td>
<td><input type="checkbox" name="cat3[2]" value="1" onClick="check()">cat3val3</td>
<td><input type="Text" name="info3" value="0/3 Angaben unvollständig" size="30" disabled></td>
</tr>
<tr>
<td>categorie 4: </td>
<td><input type="checkbox" name="cat4[val0]" value="1" onClick="check()">cat4val1</td>
<td><input type="checkbox" name="cat4[val1]" value="1" onClick="check()">cat4val2</td>
<td><input type="checkbox" name="cat4[val2]" value="1" onClick="check()">cat4val3</td>
<td><input type="Text" name="info4" value="0/3 Angaben unvollständig" size="30" disabled></td>
</tr>
</table>
</form>

</body>
</html>

<!--SCHNAPP-->

Vielen Dank

Michael

  1. hi,

    ich will unten stehende Form mittels JS validieren. Das geht aber leider nur zum Teil. Genaugenommen nur für <Input name="identxyz">. Bei <Input name="array[identxyz]"> klappt es nicht.

    da wird hier auch wöchentlich nach gefragt ...

    http://suche.de.selfhtml.org/cgi-bin/such.pl?suchausdruck=javascript+formular+feld+array+schreibweise&lang=on&feld=alle&index_5=on&index_6=on&hits=100

    gruß,
    wahsaga

    --
    "Look, that's why there's rules, understand? So that you _think_ before you break 'em."
  2. Hi,

    ich will unten stehende Form mittels JS validieren. Das geht aber leider nur zum Teil. Genaugenommen nur für <Input name="identxyz">. Bei <Input name="array[identxyz]"> klappt es nicht.

    doch: document.FORMNAME.elements["array[identxyz]"].value
    imho aber kein guter name...

    Gruesse, Joachim

    --
    Am Ende wird alles gut.
  3. Hallo,

    diese Konstruktion funktioniert leider nicht, da JavaScript in diesem Fall den Part cat3[i] nicht so interpretiert wie du das möchtest.
    Entweder wird i nicht ersetzt oder das Ergebnis nicht als String 'cat3[1]' interpreiter sondern als array 'cat3' > Element '1', welche der beiden Varianten schief läuft weiss ich nicht. Auf diesem Weg kenne ich bis jetzt auch keine Lösung.
    Da ich das Problem aber auch schonmal hatte habe ich den Work-Around über das id-Attribut benutzt.
    Man gibt dem Formularfeld neben dem 'name' auch noch eine Kennzeichnung 'id=XY'. Das hat den Vorteil das man mit document.getElementById('') zwischen den Klammern einen String angeben kann, den man beliebig zusammensetzen kann, in deinem Fall document.getElementById('cat3[' + i + ']');

    for(i=0; i<3; i++){
    if(document.self.cat3[i].checked == true){ cnt3++; }
    }

    Hoffe das hilft.
    Gruss Marcus

  4. Vielen Dank für die schnellen Antworten.

    Viele Grüße Michael