Yadgar: Zugriff auf Checkboxen in einer Tabelle

High!

Im Rahmen der Programmierung eines Lotto-Simulators (mit Auswertung durch ein PHP-Skript) will ich beim Abschicken des Lottoschein-Formulars mittels Javascript prüfen, ob tatsächlich genau 6 Zahlenfelder angekreuzt wurden.

Dazu würde ich gerne den checked-Status der 49 einzelnen Checkboxen im Formular auslesen... leider funktioniert der Zugriff auf diese Checkboxen nicht so, wie ich mir das naiverweise(?) vorgestellt hatte:

<form name="Lottoschein" action="Ziehung.php" method="post">
<table width="250">
<tr>
<td>1<br><input type="checkbox" name="1"></input></td>
<td>2<br><input type="checkbox" name="2"></input></td>
<td>3<br><input type="checkbox" name="3"></input></td>
<td>4<br><input type="checkbox" name="4"></input></td>
<td>5<br><input type="checkbox" name="5"></input></td>
<td>6<br><input type="checkbox" name="6"></input></td>
<td>7<br><input type="checkbox" name="7"></input></td>
</tr>
<tr>
<td>8<br><input type="checkbox" name="8"></input></td>
<td>9<br><input type="checkbox" name="9"></input></td>
<td>10<br><input type="checkbox" name="10"></input></td>
<td>11<br><input type="checkbox" name="11"></input></td>
<td>12<br><input type="checkbox" name="12"></input></td>
<td>13<br><input type="checkbox" name="13"></input></td>
<td>14<br><input type="checkbox" name="14"></input></td>
</tr>
<tr>
<td>15<br><input type="checkbox" name="15"></input></td>
<td>16<br><input type="checkbox" name="16"></input></td>
<td>17<br><input type="checkbox" name="17"></input></td>
<td>18<br><input type="checkbox" name="18"></input></td>
<td>19<br><input type="checkbox" name="19"></input></td>
<td>20<br><input type="checkbox" name="20"></input></td>
<td>21<br><input type="checkbox" name="21"></input></td>
</tr>
<tr>
<td>22<br><input type="checkbox" name="22"></input></td>
<td>23<br><input type="checkbox" name="23"></input></td>
<td>24<br><input type="checkbox" name="24"></input></td>
<td>25<br><input type="checkbox" name="25"></input></td>
<td>26<br><input type="checkbox" name="26"></input></td>
<td>27<br><input type="checkbox" name="27"></input></td>
<td>28<br><input type="checkbox" name="28"></input></td>
</tr>
<tr>
<td>29<br><input type="checkbox" name="29"></input></td>
<td>30<br><input type="checkbox" name="30"></input></td>
<td>31<br><input type="checkbox" name="31"></input></td>
<td>32<br><input type="checkbox" name="32"></input></td>
<td>33<br><input type="checkbox" name="33"></input></td>
<td>34<br><input type="checkbox" name="34"></input></td>
<td>35<br><input type="checkbox" name="35"></input></td>
</tr>
<tr>
<td>36<br><input type="checkbox" name="36"></input></td>
<td>37<br><input type="checkbox" name="37"></input></td>
<td>38<br><input type="checkbox" name="38"></input></td>
<td>39<br><input type="checkbox" name="39"></input></td>
<td>40<br><input type="checkbox" name="40"></input></td>
<td>41<br><input type="checkbox" name="41"></input></td>
<td>42<br><input type="checkbox" name="42"></input></td>
</tr>
<tr>
<td>43<br><input type="checkbox" name="43"></input></td>
<td>44<br><input type="checkbox" name="44"></input></td>
<td>45<br><input type="checkbox" name="45"></input></td>
<td>46<br><input type="checkbox" name="46"></input></td>
<td>47<br><input type="checkbox" name="47"></input></td>
<td>48<br><input type="checkbox" name="48"></input></td>
<td>49<br><input type="checkbox" name="49"></input></td>
</tr>
</table>
<input type="submit" value="Ziehen!"></input>
</form>

Die Javascript-Anweisungen

chk = document.getElementsByName("1").checked;
  alert(chk);

führen zwar nicht zu einer Meldung auf der Fehlerkonsole, aber zur Ausgabe von "undefined". Wieso? Eigentlich sollte "checked" doch vom Typ "bool" sein und folglich "true" oder "false" angezeigt werden...

Bis bald im Khyberspace!

Yadgar

  1. Die Javascript-Anweisungen

    chk = document.getElementsByName("1").checked;
      alert(chk);

    führen zwar nicht zu einer Meldung auf der Fehlerkonsole, aber zur Ausgabe von "undefined". Wieso? Eigentlich sollte "checked" doch vom Typ "bool" sein und folglich "true" oder "false" angezeigt werden...

    Du kennst selfhtml?
    http://de.selfhtml.org/javascript/objekte/elements.htm

    Aber auch zu der von dir verwendeten Funktion gibt es erstaunlicherweise eine Beschreibung http://de.selfhtml.org/javascript/objekte/document.htm#get_elements_by_name

    Wobei ich das erste bevorzugen würde.

    Struppi.

    --
    Javascript ist toll (Perl auch!)
  2. hi,

    <td>1<br><input type="checkbox" name="1"></input></td>
    <td>2<br><input type="checkbox" name="2"></input></td>
    <td>3<br><input type="checkbox" name="3"></input></td>

    Diese Benamung erscheint mir nicht sonderlich günstig - Probleme bzw. Verwechslungen, bspw. bei gleichzeitiger Verwendung von NodeLists mit nummerischem Index, sind beinahe vorprogrammiert.

    Warum nicht einfach allen Checkboxen den gleichen Namen geben - und die Lottozahl über deren value-Attribut übergeben?
    Wenn du für den Namen noch eine Schreibweise á la name="Lottozahl[]" nutzt, bekommst du damit auch bspw. in PHP ein Array mit den genau den Werten, die angekreuzt wurden.

    Und zum "Durchzählen" der angekreuzten Felder könntest du einfach
    document.forms['Lottoschein'].elements['Lottozahl[]']
    in einer Schleife durchlaufen.

    gruß,
    wahsaga

    --
    /voodoo.css:
    #GeorgeWBush { position:absolute; bottom:-6ft; }
    1. High!

      Warum nicht einfach allen Checkboxen den gleichen Namen geben - und die Lottozahl über deren value-Attribut übergeben?
      Wenn du für den Namen noch eine Schreibweise á la name="Lottozahl[]" nutzt, bekommst du damit auch bspw. in PHP ein Array mit den genau den Werten, die angekreuzt wurden.

      Und zum "Durchzählen" der angekreuzten Felder könntest du einfach
      document.forms['Lottoschein'].elements['Lottozahl[]']
      in einer Schleife durchlaufen.

      Das funktioniert bei mir auch nicht... ich bekomme immer nur die Fehlermeldung "document.forms.Lottoschein has no properties"! Ich glaube allmählich wirklich, ich bin einfach zu dumm zum Programmieren und sollte besser für einen Euro/Stunde Toiletten putzen!

      Uärgl!

      Yadgar

      1. Hallo,

        Ich glaube allmählich wirklich, ich bin einfach zu dumm zum Programmieren und sollte besser für einen Euro/Stunde Toiletten putzen!

        Keine Späße über Leute, die das tatsächlich _MÜSSEN_.
        Nicht, wo wir derzeit soviele Hartz IV Threads haben.

        bydey

        --
        -- bydey ist die Signatur und Verabschiedung, nicht der Nick --
        -- Navigate all your PHP web projects with  PHP Project Browser--
        1. High!

          Keine Späße über Leute, die das tatsächlich _MÜSSEN_.
          Nicht, wo wir derzeit soviele Hartz IV Threads haben.

          Ich bin selbst Hartzer, zur Zeit in einer Umschulung ("Programmierer für allgemeine Anwendungen"), und wenn nicht noch ein Wunder passiert, wird mir diese ganze trostlose Elendsscheiße auch blühen!

          Ich bin schon viel zu spät dran, ich habe gar nicht mehr die Zeit, in den verbleibenden drei Monaten noch alles das zu lernen, was ich eigentlich lernen müsste - die Qualität des Unterrichts ist nämlich nicht so berauschend, die meiste Arbeit muss ich selbst durch autodidaktisches Büffeln leisten - und da ist die Lernkurve so elend steil, dass ich davon ausgehe, es einfach nicht zu schaffen.

          Ich werde hier in drei Monaten mit einem Zertifikat abgehen, das wenig mehr besagt, als dass ich hier ein Jahr lang mehr oder weniger regelmäßig an den Rechnern gesessen und versucht habe, Programmiersprachen zu lernen (C++, PHP, VisualBasic, SQL...)... aber Hartzer werde ich wohl auf unabsehbare Zeit bleiben müssen, schlimmstenfalls (meine alte Paranoia) verschwinde ich irgendwann mit den Millionen und Abermillionen anderen Losern in einem Zwangsarbeitslager, wo wir unter elendesten Bedingungen (Massenschlafsäle, Verpflegung aus Großküchenabfällen, 120-Stunden-Woche...) zu Tode vernutzt werden...

          Bis bald im Khyberspace!

          Yadgar

          1. ...schlimmstenfalls (meine alte Paranoia) verschwinde ich irgendwann mit den Millionen und Abermillionen anderen Losern in einem Zwangsarbeitslager, wo wir unter elendesten Bedingungen (Massenschlafsäle, Verpflegung aus Großküchenabfällen, 120-Stunden-Woche...) zu Tode vernutzt werden...

            Sowas hört man doch gerne.

            üblicherweise herrscht hier die Meinung, wer arbeiten will, der kriegt auch welche.

            Eine Aussage, die schon immer Unsinn war.

            Struppi.

            --
            Javascript ist toll (Perl auch!)
          2. Hallo,

            High!

            Keine Späße über Leute, die das tatsächlich _MÜSSEN_.
            Nicht, wo wir derzeit soviele Hartz IV Threads haben.

            Ich bin selbst Hartzer, zur Zeit in einer Umschulung ("Programmierer für allgemeine Anwendungen"), und wenn nicht noch ein Wunder passiert, wird mir diese ganze trostlose Elendsscheiße auch blühen!
            Ich glaube allmählich wirklich, ich bin einfach zu dumm zum Programmieren und sollte besser für einen Euro/Stunde Toiletten putzen!

            In diesem Falle bist du natürlich berechtigt den Vergleich heranzuziehen. Daß du tatsächlich so nah am Abgrund stehst tut mir leid für dich!

            bydey

            --
            -- bydey ist die Signatur und Verabschiedung, nicht der Nick --
            -- Navigate all your PHP web projects with  PHP Project Browser--
      2. Und zum "Durchzählen" der angekreuzten Felder könntest du einfach
        document.forms['Lottoschein'].elements['Lottozahl[]']
        in einer Schleife durchlaufen.

        Das funktioniert bei mir auch nicht... ich bekomme immer nur die Fehlermeldung "document.forms.Lottoschein has no properties"!

        sinnvoll wäre natürlich auch Code dazu. So kann man dir nur sagen, dass du kein Element mit dem Namen 'Lottoschein' in deinem Dokument hast, zumindest nicht zum Zeitpunkt des Aufrufs.

        Struppi.

        --
        Javascript ist toll (Perl auch!)
        1. High!

          sinnvoll wäre natürlich auch Code dazu. So kann man dir nur sagen, dass du kein Element mit dem Namen 'Lottoschein' in deinem Dokument hast, zumindest nicht zum Zeitpunkt des Aufrufs.

          Hier ist der Code:

          <html>
          <head>
          <style type="text/css">
            td { text-align:center }
          </style>
          <script language="javascript" type="text/javascript">
            Feld = new Array(49);
            ch=0;
            for (i=0; i<49; i++)
            {
              if (document.forms[0].elements['Lottozahl'][i].checked)
              {
                ch++;
              }
            }
            alert(ch);
          </script>
          <title>LOTTO - 6 aus 49</title>
          </head>
          <body>
          <form name="Lottoschein" action="Ziehung.php" method="post">
          <table width="250">
          <tr>
          <td>1<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>2<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>3<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>4<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>5<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>6<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>7<br><input type="checkbox" name="Lottozahl"></input></td>
          </tr>
          <tr>
          <td>8<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>9<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>10<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>11<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>12<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>13<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>14<br><input type="checkbox" name="Lottozahl"></input></td>
          </tr>
          <tr>
          <td>15<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>16<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>17<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>18<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>19<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>20<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>21<br><input type="checkbox" name="Lottozahl"></input></td>
          </tr>
          <tr>
          <td>22<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>23<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>24<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>25<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>26<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>27<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>28<br><input type="checkbox" name="Lottozahl"></input></td>
          </tr>
          <tr>
          <td>29<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>30<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>31<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>32<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>33<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>34<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>35<br><input type="checkbox" name="Lottozahl"></input></td>
          </tr>
          <tr>
          <td>36<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>37<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>38<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>39<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>40<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>41<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>42<br><input type="checkbox" name="Lottozahl"></input></td>
          </tr>
          <tr>
          <td>43<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>44<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>45<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>46<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>47<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>48<br><input type="checkbox" name="Lottozahl"></input></td>
          <td>49<br><input type="checkbox" name="Lottozahl"></input></td>
          </tr>
          </table>
          <input type="submit" value="Ziehen!"></input>
          </form>

          </body>

          </html>

          ...aber egal, was ich mache, ich bekomme immer nur "document.forms[0] has no properties"!

          Bis bald im Khyberspace!

          Yadgar

          1. sinnvoll wäre natürlich auch Code dazu. So kann man dir nur sagen, dass du kein Element mit dem Namen 'Lottoschein' in deinem Dokument hast, zumindest nicht zum Zeitpunkt des Aufrufs.

            Hier ist der Code:

            Meine zweite Vermutung trifft zu.
            Mach den code hinter das Formular.

            <script language="javascript" type="text/javascript">
              Feld = new Array(49);

            Das ist überflüssig.

            ch=0;
              for (i=0; i<49; i++)

            Vermeide wann immer möglich globale Variabeln, vor allem Schleifenzähler. Ausserdem musst du hier die Anzahl nicht fest vorgeben:

            var zahlen = document.forms[0].elements['Lottozahl'];
            for (var i = 0; i < zahlen.length; i++)

            Struppi.

            --
            Javascript ist toll (Perl auch!)
          2. Hallo Yadgar,

            der Zugriff erfolgt ganz am Anfang, bevor der Rest der Seite mit dem Formular geladen ist. Daher die Meldung. Du musst Dein Script in eine Funktion legen und z.B. per onload im body aufrufen.

            Javascripte im HEAD-Bereich, die nicht in Funktionen stehen, werden sofort aufgerufen. Der Rest der Seite existiert zu diesem Zeitpunkt noch nicht.

            Gruß, Jürgen

          3. Hallo,

            if (document.forms[0].elements['Lottozahl'][i].checked)
            [...]
            <form name="Lottoschein" action="Ziehung.php" method="post">

            ...aber egal, was ich mache, ich bekomme immer nur "document.forms[0] has no properties"!

            In dem Moment, in dem du versuchst per JS auf das Formaular zuzugreifen,
            existiert dieses noch gar nicht, da das Dokument noch nicht vollständig
            geladen ist.

            Pack dein JS in eine Funktion, die du mittels 'window.onload' aufrufst.

            Gruß, Jan