Event Listener in Schleife hinzfügen

[razer2k]

Hallo!

Ich habe ein kleines Problem mit Javascript. Und zwar erstelle ich gerade einen einfachen DatePicker bzw. Kalender und wenn man auf ein Datum klickt, möchte ich das Datum in ein Textfeld schreiben lassen.
Damit das passiert, füge ich jedem Datum (das eine Tabellenzelle ist) einen Event-Handler hinzu.

Hier mal auszugsweise der Quellcode:

while (currentDate <= lastDayInCalendar)
{

  var cellDay = document.createElement("td");

  cellDay.innerHTML = currentDate.getDate();

  if (window.addEventListener) {
    cellDay.addEventListener('click', function(evt) { 
        this.select(currentDate.getDate());
        }, false);
  }

  row.appendChild(cellDay);

  currentDate.setTime(currentDate.getTime()+(1000*60*60*24));
} 

currentDate und lastDayInCalendar sind beides Date-Objekte. click-Event möche ich dann meine Funktion select() aufrufen, die die Zeit mit übergeben bekommt und dann das Textfeld entsprechend formatiert füllt.

Soweit funktioniert das vom Prinzip her auch. Das Problem ist nur, dass (egal welches Datum ich klicke) immer der letzte currentDate-Wert in das Feld geschrieben wird. Also ein Tag nach dem Wert von lastDayInCalendar (da in der Schleife currentDate immer erhöht wird). Der Event-Handler nimmt also den Wert von currentDate zu dem Zeitpunkt, wenn ich klicke, was ja auch irgendwie richtig ist, ich hier aber nicht möchte.

Wie kann ich dieses Problem umgehen und ähnlich wie beim Zelleninhalt dem Event-Handler einen festen Wert übergeben, der nicht später bei dem Klick erst aus currentDate gelesen wird.

Habe ich mich verständlich ausgedrückt?

Jan

[PHP-Desaster]

if (window.addEventListener) {
    cellDay.addEventListener('click', function(evt) { 
        this.select(currentDate.getDate());
    }, false);
} 

currentDate ist an dieser Stelle eine Referenz, d.h. wird auch durch deine Änderungen geändert. Umgehen kannst du das, wenn du diese Funktion in einer anderen Funktion erzeugst, d.h. mit einer lokalen Variable arbeitest. Vielleicht kannst du auch mit dieser clone-Funktion was machen.

[razer2k]

Hey!

Danke für die Antwort, aber clone wollte ich lieber vermeiden.
Ich hab das Problem jetzt auf eine ähnliche Art gelöst.

Und zwar erzeuge ich jede Zelle der Tabelle in einer eigenen Funktion, diese Funktion bekommt übergeben: Datum in Millisekunden, Zelleninhalt, CSS-Klasse, etc.
Innerhalb der Funktion mache ich einfach ein neues Date Objekt (da ich ja die Sekunden eh habe), baue mir alles zusammen, inkl. Event Listener und gebe das Element zurück, das ich nun einfach mit appendChild() an die Tabelle anhänge.

Das ganze funktioniert aber halt nur, wenn ich ein neues Date Objekt innerhalb der Funktion erstellen. Übergebe ich das Date Objekt selbst und verwende es in der Funktion, kappt es wieder mal nicht, da es anscheinend als Referenz übergeben wird.

Grüße,
Jan