keine Ausführung bei dynamischen Zeilen

[Vogelhaus]

Hallo,

ich habe eine Tabelle (per PHP) erzeugt und diese ist per Javascript erweiterbar.
In der "original Tabelle" funktioniert eine CSS- und JS-Funktionalität zur Darstellung
eines Calendar-Widgets einwandfrei.
Bei den dynamisch erstellten Zeilen wird zwar das Symbol (gif) angezeigt, aber die Funktionalität dahinter nicht.
Die Zeilen sehen laut Chrome "Element untersuchen" vollkommen identisch aus:

Originale Zeile:

  
<input type="text" class="tcal tcalInput" name="free_data[18][f_practice_date]" value="29.11.2014" style="width: 95px">  

Dynamisch erzeugte Zeile (hab es mit und ohne value vesucht):

  
<input type="text" class="tcal tcalInput" name="free_data[21][f_practice_date]" value=" " style="width: 95px">  

Wer hat eine Idee, warum ich in der neuen Zeile die Kalenderfunktion nicht nutzen kann?
Vielen Dank im Voraus !!!

Script zur Erstellung der dynamischen Zeile:

  
<script type='text/javascript'>  
function addRow(tableId)  
{  
    var tabelle = document.getElementById(tableId);  
    var row = tabelle.insertRow(-1); // -1 = am ende  
    var cell = row.insertCell(-1);  
    var cell2 = row.insertCell(-1);  
    var cell3 = row.insertCell(-1);  
    var cell4 = row.insertCell(-1);  
    var cell5 = row.insertCell(-1);  
    var cell6 = row.insertCell(-1);  
    cell.innerHTML = "<input type='hidden' name='save["+tabelle.rows.length+"]'  value='"+tabelle.rows.length+"'>"+  
					 "<input type='text' class='tcal tcalInput' name='free_data["+tabelle.rows.length+"][f_practice_date]' value=' ' style='width: 95px'>";  
	cell2.innerHTML = "<input type='text' class='center' name='free_data["+tabelle.rows.length+"][pr_place]' style='width: 40px'>";  
    cell3.innerHTML = "<input type='text' name='free_data["+tabelle.rows.length+"][pr_opponent]' style='width: 255px'>";  
	cell4.innerHTML = "<input type='text' class='center' name='free_data["+tabelle.rows.length+"][pr_meet]' style='width: 75px'>";  
	cell5.innerHTML = "<input type='text' class='center' name='free_data["+tabelle.rows.length+"][pr_kickoff]' style='width: 75px'>";  
	cell6.innerHTML = "<input type='text' class='center' name='free_data["+tabelle.rows.length+"][pr_score]' style='width: 80px'>";  
}  
</script>  

[ChrisB]

Hi,

Wer hat eine Idee, warum ich in der neuen Zeile die Kalenderfunktion nicht nutzen kann?

Vermutlich, weil diese noch nicht im Dokument vorhanden waren, als die für die Funktionalität nötigen Eventhandler registriert wurden, und diese nur an zu dem Zeitpunkt bereits existente Elemente gebunden wurden.

MfG ChrisB

[Vogelhaus]

Hi,

Wer hat eine Idee, warum ich in der neuen Zeile die Kalenderfunktion nicht nutzen kann?

Vermutlich, weil diese noch nicht im Dokument vorhanden waren, als die für die Funktionalität nötigen Eventhandler registriert wurden, und diese nur an zu dem Zeitpunkt bereits existente Elemente gebunden wurden.

MfG ChrisB

So etwas ähnliches habe ich auch gerade entdeckt.
Laut Chrome gibt es für die "Orignalzeile" einen EventListener, den es bei der neuen dynamischen Zeile nicht gibt.

Wie kann ich diesen denn nachträglich einbauen, damit dieser auch bei der neuen Zeile da ist ?

VG Andy

[Vogelhaus]

Hi,

Wer hat eine Idee, warum ich in der neuen Zeile die Kalenderfunktion nicht nutzen kann?

Vermutlich, weil diese noch nicht im Dokument vorhanden waren, als die für die Funktionalität nötigen Eventhandler registriert wurden, und diese nur an zu dem Zeitpunkt bereits existente Elemente gebunden wurden.

MfG ChrisB

So etwas ähnliches habe ich auch gerade entdeckt.
Laut Chrome gibt es für die "Orignalzeile" einen EventListener, den es bei der neuen dynamischen Zeile nicht gibt.

Wie kann ich diesen denn nachträglich einbauen, damit dieser auch bei der neuen Zeile da ist ?

VG Andy

Habe es schon gefunden

  
cell.addEventListener('click', f_tcalInit, false);  

Danke für den Denkanstoß !!!

VG Andy

[Bobby]

Moin

Ein Hinweis sei mir gestattet. Fullquotes Bitte vermeiden... egal ob TOFU ODER TUFO. Danke

Gruß Bobby

[Matthias Apsel]

Om nah hoo pez nyeetz, Vogelhaus!

Habe es schon gefunden

cell.addEventListener('click', f_tcalInit, false);

  
Es könnte auch klug sein, die Anzahl der Eventhandler zu beschränken, indem man \*einen\* Handler für ein gemeinsames Vorfahrenelement registriert.  
  
Matthias

-- 
Der Unterschied zwischen Java und JavaScript ist größer als der zwischen [Vene und Venedig](http://selfhtml.apsel-mv.de/java-javascript/index.php?buchstabe=V#vene).  
![](http://www.billiger-im-urlaub.de/kreis_sw.gif)