TypeError: ButtonAbsenden.className is undefined

[Enrico]

Hallo,

ich möchte grafische Buttons in Abhängigkeit der Ergebnisse bereits erfolgter Validierungen verfügbar machen bzw. nicht verfügbar machen, so dass ein dynamisch erzeugtes Formular erst dann abgesendet werden kann, wenn alle Validierungen erfolgreich verlaufen sind.

Dabei unterscheide ich, ob die Buttons innerhalb oder außerhalb der einzelnen Formularabschnitten angezeigt werden.

Darüber hinaus kann das dynamisch erzeugte Formular bis zu drei Buttons haben, wobei der Button mit der höchsten ID immer der "Absende"-Button ist.

Alle Button bestehen immer aus einer linken, mittleren und rechten Grafik.

Mein Problem ist nun, diese ID zu ermitteln, anhand derer sich die Indizes für die weiteren Grafiken des Buttons ergeben.

Das ist mein aktueller Ansatz:

  
function Absendebutton_steuern ()  
{  
   var j = Object.keys(Fehler).length,  
       ButtonAbsenden;  
  
   if (j === 0)  
   {  
      document.getElementById("Fehlermeldung").innerHTML = "";  
  
      var Suffix = 3;  
  
      do  
      {  
         Suffix -= 1;  
  
         if (Suffix == 0)  
            Suffix = "";  
      }  
      while (ButtonAbsenden = document.getElementById("ButtonMitte" + Suffix) === false);  
  
      var Darstellung = ButtonAbsenden.className.replace(/[^\d]/g, "");  
  
      [...] weiterer Code [...]  
   }  
   else  
   {  
      [...] weiterer Code [...]  
   }  
}  

Ich bekomme für die Zeile "var Darstellung = ..." die Fehlermeldung "TypeError: ButtonAbsenden.className is undefined".

"className" habe ich richtig geschrieben, daran dürfte es nicht liegen.

Bei meinem Testformular wird mir nach der do-while-Schleife bei der Variablen "Suffix" der Wert 2 ausgegeben, was auch tatsächlich der ID des Absendebuttons entspricht.

Dies bedeutet für mich, dass die Schleife beim Durchlauf   ButtonAbsenden = document.getElementById("ButtonMitte" + 2)   erfolgreich war und die Variable "ButtonAbsenden" auch definiert wurde/sein müsste.

Zudem wird die Funktion "Absendebutton_steuern ()" nach dem onblur-Ereignis im Textfeld von der Validierungsfunktion aufgerufen, d.h. das Formular ist zu diesem Zeitpunkt vollständig aufgebaut.

Warum erhalte ich dann bei der Folgeanweisung "var Darstellung = ..." diese Fehlermeldung?

Danke und Gruß,
Enrico

[molily]

Hallo!

do
      {
      }
      while (ButtonAbsenden = document.getElementById("ButtonMitte" + Suffix) === false);

1. Dieser Ausdruck wird so abgearbeitet, dass das Ergebnis von getElementById(…) === false in die Variable ButtonAbsenden geschrieben wird. Das liegt an der http://de.selfhtml.org/javascript/sprache/operatoren.htm#rangfolge@title=Operatorenrangfolge. Mit Klammern kannst du die Abarbeitung steuern:

(variable = document.getElementById(…)) === false

Dann wird das Element in der variable gespeichert, nicht das Ergebnis der Vergleichsoperation.

2. getElementById gibt null, nicht false zurück. Wenn du auf === false prüfst (strenge Wert- und Typengleichheit), so ist null niemals === false. Entweder du prüfst hier auf === null oder einfach auf »Wahrheit« (»truthy«), indem du === false weglässt.

Mathias

[molily]

Dies bedeutet für mich, dass die Schleife beim Durchlauf   ButtonAbsenden = document.getElementById("ButtonMitte" + 2)   erfolgreich war und die Variable "ButtonAbsenden" auch definiert wurde/sein müsste.

So etwas solltest du prüfen, indem du Ausgaben auf der JavaScript-Konsole mit console.log() machst oder mit dem Debugger arbeitest (debugger; in den Code einfügen, um einen Haltepunkt zu erzeugen). Dabei hättest du vermutlich herausbekommen, dass ButtonAbsenden zwar einen Wert hat, der nicht null oder undefined ist, aber kein DOM-Element beinhaltet. So erklärt sich nämlich, dass ButtonAbsenden.className den Wert undefined zurückgibt, sodass ButtonAbsenden.className.replace(…) den besagten Fehler wirft.

Grüße,
Mathias

[Enrico]

Hallo Mathias,

danke vielmals, jetzt klappt es wie gewünscht! :-)

Gruß,
Enrico