Leeloo5E: Checkbox-Array vor Formular absenden prüfen

Hallo,

ich versuche mich gerade ein wenig an Javascript. Möchte Formularfelder vor Absenden des Formulars überprüfen. Dazu habe ich hier bei SELFHTML schon einiges gefunden. Nun habe ich aber das Problem mit mehreren Checkboxen, die ich wie folgt angebe:

  
 <input id="checkbox0" type="checkbox" name="checkboxen[]" value="Checkbox0" /><span>Checkbox0</span>  
 <input id="checkbox1" type="checkbox" name="checkboxen[]" value="Checkbox1" /><span>Checkbox1</span>  
 <input id="checkbox2" type="checkbox" name="checkboxen[]" value="Checkbox2" /><span>Checkbox2</span>  

Ich möchte nun überprüfen, ob die erste Checkbox ausgewählt wurde. Das kann man wohl auf mehrere Weisen tun:

  
if (document.getElementsByName('checkboxen[]')[0].checked == true) {  
  alert("bin angeklickt");  
  return false;  
}//end if  
oder auch mit  
if (document.getElementsById('checkbox0').checked == true) {  
  alert("bin angeklickt");  
  return false;  
}//end if  
oder mal so  
if (document.formular.checkboxen[0].checked == true) {  
  alert("bin angeklickt");  
  return false;  
}//end if  

Allerdings scheint keine der Varianten zu funktionieren. Oder bin ich nur zu blöd!? Scheinbar.
Die Defintion der Checkboxen als Array - nämlich so name="checkboxen[]" - brauche ich, um die dann besser in meinem PHP-Skript auszuwerten.
Oder greift Javascript da gar nicht, wenn ich das wie oben definiere?

Gruß,
Leeloo

--
"Als es noch keine Computer gab, war das Programmieren noch relativ einfach." - Edsger W. Dijkstra
  1. hi,

    if (document.getElementsByName('checkboxen[]')[0].checked == true) {

    Der Zugriff sollte OK sein.

    if (document.getElementsById('checkbox0').checked == true) {

    Der auch.

    if (document.formular.checkboxen[0].checked == true) {

    Der nicht - du hast kein Formularlement mit dem Namen "checkboxen".

    Allerdings scheint keine der Varianten zu funktionieren.

    Und das heisst?
    Hast du Kontrollausgaben gemacht - um bspw. erst mal zu kontrollieren, ob dein Code überhaupt zur Ausführung kommt?
    Gibt es Fehlermeldungen in der Javascript-Konsole?

    gruß,
    wahsaga

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

      if (document.formular.checkboxen[0].checked == true) {

      Der nicht - du hast kein Formularlement mit dem Namen "checkboxen".

      Jo, dachte ich mir, aber die Angabe

        
      if (document.formular.checkboxen[][0].checked == true)  
      
      

      funktioniert im übrigen auch nicht.

      Allerdings scheint keine der Varianten zu funktionieren.

      Und das heisst?
      Hast du Kontrollausgaben gemacht - um bspw. erst mal zu kontrollieren, ob dein Code überhaupt zur Ausführung kommt?

      Nicht-funktionieren heißt hier, meine Kontrollausgabe:

        
      alert("bin angehakelt");  
      
      

      kommt nicht.

      Gibt es Fehlermeldungen in der Javascript-Konsole?

      Aaaaaaaaaah, sowas gibts auch!? Wahnsinnn.
      Da war nen simpler Syntaxfehler drin in dem Script. Toll und ich wundere mich, warum da nüscht geht *grummel*
      Die Variante mit getElementByName funzt *freu*

      Aber die Variante mit den checkboxen[][0] funzt eben net. Is och nen Syntaxerror. Blöd.

      THX wahsaga. Die Fehlerkonsole kannt ich nicht.

      Gruß,
      Leeloo

      --
      "Als es noch keine Computer gab, war das Programmieren noch relativ einfach." - Edsger W. Dijkstra
    2. Hallo,

      Der Zugriff sollte OK sein.

      if (document.getElementsById('checkbox0').checked == true) {

      Der auch.

      Sicher nicht! Ohne "s" eher.

      Grüße
      Thomas

  2. Hi,

    Allerdings scheint keine der Varianten zu funktionieren. Oder bin ich nur zu blöd!? Scheinbar.

    scheinbar oder anscheinend?

    Richtig ist, dass diese Variante:

    if (document.getElementsByName('checkboxen[]')[0].checked == true) {

    je nach Browser zu Problemen führen kann. Ebenso wie diese:

    if (document.getElementsById('checkbox0').checked == true) {

    setzt sie auf DOM-Methoden, die ich aufgrund der Existenz des sehr viel spezielleren Formular-Objektmodells, welches exakt das ist, was Du hier brauchst, nicht verwenden würde.

    if (document.formular.checkboxen[0].checked == true) {

    Dies hier kann natürlich nicht funktionieren, weil Du nirgendwo ein Formularelement namens "checkboxen" vorliegen hast, geschweige denn mehrere, so dass sich ein Array-Index ergeben könnte. Deine Elemente heißen "checkboxen[]", also musst Du auf genau diese zugreifen.

    Die Defintion der Checkboxen als Array - nämlich so name="checkboxen[]"

    Der Name definiert für JavaScript absolut nicht das geringste als Array. Das geschieht durch das mehrfache Vorkommen des selben Namens, also beispielsweise durch zwei <input name="checkboxen"/>.

    brauche ich, um die dann besser in meinem PHP-Skript auszuwerten.

    Dieser PHP-Bug ist bekannt.

    Oder greift Javascript da gar nicht, wenn ich das wie oben definiere?

    JavaScript interessiert sich nicht die Bohne für irgend etwas, was PHP benötigt. Nutze die verschiedenen Arten, auf Formularelemente zuzugreifen.

    Cheatah

    --
    X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    1. Hallo,

      Hi,

      Allerdings scheint keine der Varianten zu funktionieren. Oder bin ich nur zu blöd!? Scheinbar.

      scheinbar oder anscheinend?

      Ich bin zu blöd. Ich gebs ja zu. Weder scheinbar noch anscheinend. ;-(

      Richtig ist, dass diese Variante:

      if (document.getElementsByName('checkboxen[]')[0].checked == true) {

      je nach Browser zu Problemen führen kann. Ebenso wie diese:

      if (document.getElementsById('checkbox0').checked == true) {

      setzt sie auf DOM-Methoden, die ich aufgrund der Existenz des sehr viel spezielleren Formular-Objektmodells, welches exakt das ist, was Du hier brauchst, nicht verwenden würde.

      Hm ... ok.

      Der Name definiert für JavaScript absolut nicht das geringste als Array. Das geschieht durch das mehrfache Vorkommen des selben Namens, also beispielsweise durch zwei <input name="checkboxen"/>.

      Jupp, das habe ich auch schon mitbekommen.

      JavaScript interessiert sich nicht die Bohne für irgend etwas, was PHP benötigt.

      Hab ich je was anderes behauptet?! War mir schon klar.

      Gruß,
      Leeloo

      --
      "Als es noch keine Computer gab, war das Programmieren noch relativ einfach." - Edsger W. Dijkstra
      1. Hi,

        Oder bin ich nur zu blöd!? Scheinbar.
        scheinbar oder anscheinend?
        Ich bin zu blöd. Ich gebs ja zu. Weder scheinbar noch anscheinend. ;-(

        darüber spekuliere ich erst, wenn Du uns verrätst, inwieweit Dir der von mir genannte Link helfen konnte, auf den Du Dich in Deinem Posting leider keinen Deut bezogen hast.

        Cheatah

        --
        X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
        X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
        X-Will-Answer-Email: No
        X-Please-Search-Archive-First: Absolutely Yes
  3. <input id="checkbox0" type="checkbox" name="checkboxen[]" value="Checkbox0" /><span>Checkbox0</span>
    <input id="checkbox1" type="checkbox" name="checkboxen[]" value="Checkbox1" /><span>Checkbox1</span>
    <input id="checkbox2" type="checkbox" name="checkboxen[]" value="Checkbox2" /><span>Checkbox2</span>

      
    Die ID ist i.d.R. unnötig, aber wenn du statt eines <span> ein <label> verwendest brauchst du die ID, das wäre auch ratsam, dann läßt sich z.b. auch der Text anklicken um die Box zu markieren.  
      
    für dein Skript ist die ID aber nicht nötig, da du über document.forms['Name'].elements['Name'] auf jedes Element zugreifen kannst.  
      
    
    > Die Defintion der Checkboxen als Array - nämlich so name="checkboxen[]" - brauche ich, um die dann besser in meinem PHP-Skript auszuwerten.  
      
    übrigens hatten das Problem vor dir schon Millionen das ist eine Frage die mehrmals pro Woche auftaucht. Alle stolpern über [] und denken das hätte etwas mit einem Array zu tun, in diesem Fall nicht, es ist für JS einfach ein Bestandteil des Namens. Erst für PHP wird es zu enem Array aufbereitet.  
      
    Struppi.
    
    -- 
    [Javascript ist toll](http://javascript.jstruebig.de/) (Perl auch!)
    
    1. hi,

      aber wenn du statt eines <span> ein <label> verwendest brauchst du die ID

      Nicht unbedingt. Die Checkbox kann auch mit ins Label verfrachtet werden.

      gruß,
      wahsaga

      --
      /voodoo.css:
      #GeorgeWBush { position:absolute; bottom:-6ft; }
    2. Hallo,

      für dein Skript ist die ID aber nicht nötig, da du über document.forms['Name'].elements['Name'] auf jedes Element zugreifen kannst.

      Ich hab die ID nur eingebaut, um evtl. getElementById zu verwenden.

      Die Defintion der Checkboxen als Array - nämlich so name="checkboxen[]" - brauche ich, um die dann besser in meinem PHP-Skript auszuwerten.

      übrigens hatten das Problem vor dir schon Millionen das ist eine Frage die mehrmals pro Woche auftaucht. Alle stolpern über [] und denken das hätte etwas mit einem Array zu tun, in diesem Fall nicht, es ist für JS einfach ein Bestandteil des Namens. Erst für PHP wird es zu enem Array aufbereitet.

      Jo, dacht ich mir, aber Herr Google hat mir leider dazu keinen Ansatz einer Lösung präsentieren können :-(

      Interessant bleibt die Frage, warum dann

        
      if (document.forumular.checkboxen[][0].checked == true) {  
      
      

      zu einem Syntaxerror führt, wenn JavaScript den Namen eines Feldes ganz einfach als String sieht, egal wie er aussieht.
      Aber egal.

      Gruß,
      Leeloo

      --
      "Als es noch keine Computer gab, war das Programmieren noch relativ einfach." - Edsger W. Dijkstra
      1. Interessant bleibt die Frage, warum dann

        if (document.forumular.checkboxen[][0].checked == true) {

        
        > zu einem Syntaxerror führt, wenn JavaScript den Namen eines Feldes ganz einfach als String sieht, egal wie er aussieht.  
          
        Wo ist in deinem Beispiel ein String?  
        document ist ein Objekt  
        document.forumular ist ein Objekt  
        document.forumular.checkboxen ist ein zweidimensonales Array, wovon du nur einen Index nutzt, den ersten Index leer läßt  
          
        Ein String sieht z.b. so aus: 'checkboxen[]'  
          
        Struppi.
        
        -- 
        [Javascript ist toll](http://javascript.jstruebig.de/) (Perl auch!)
        
        1. Hallo,

          Wo ist in deinem Beispiel ein String?
          document ist ein Objekt
          document.forumular ist ein Objekt

          ist es nicht.

          forumlar? Forumler vielleicht, aber der ist ja was anderes. ;-)

          Grüße
          Thomas

          1. ist es nicht.

            ist es doch.

            forumlar? Forumler vielleicht, aber der ist ja was anderes. ;-)

            Nein, bei ihr heißt es:
            document.forumular.checkboxen[][0]

            Also war meine Vermutung, dass es ein Formular gibt mit dem Namen 'forumular', das war past&copy

            Struppi.

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

    ich versuche mich gerade ein wenig an Javascript. Möchte Formularfelder vor Absenden des Formulars überprüfen. Dazu habe ich hier bei SELFHTML schon einiges gefunden. Nun habe ich aber das Problem mit mehreren Checkboxen, die ich wie folgt angebe:

    [...]

    Allerdings scheint keine der Varianten zu funktionieren.

    Bei mir funktioniert das eigentlich einwandfrei:
    -------------------------------
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
     <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
     <title>Untitled</title>
     <script type="text/javascript">
      function checkForm() {
       var arrBoxen = document.getElementsByName("checkboxen[]");
       for (var i = 0; i < arrBoxen.length; i++) {
        if(arrBoxen[i].checked == true) {
         alert(arrBoxen[i].id)
        }
       }
      }
     </script>
    </head>
    <body>
    <form>
    <input id="checkbox0" type="checkbox" name="checkboxen[]" value="Checkbox0" /><span>Checkbox0</span><br />
    <input id="checkbox1" type="checkbox" name="checkboxen[]" value="Checkbox1" /><span>Checkbox1</span><br />
    <input id="checkbox2" type="checkbox" name="checkboxen[]" value="Checkbox2" /><span>Checkbox2</span><br />
    <input type="button" value="klick mich" onclick="checkForm()" />
    </form>
    </body>
    </html>
    -------------

    Grüße
    Thomas