selfhtml kalender - ausgewähltes datum in select übergeben

[jen]

Hallo!

Meine Frage bezieht sich auf den Kalender, den es auf SELFHTML gibt ( http://de.selfhtml.org/javascript/beispiele/monatskalender.htm ).

Wie setzte ich es um, dass der ausgewählte Tag, Monat und Jahr in eine Auswahlliste übergeben wird? Also die jeweilige <option select> ____ befüllt wird?
Und muss der Code dazu in die .htm des Kalenders oder der .htm, von der aus der Kalender mit javascript:newWindow() aufgerufen wird?

Schonmal danke und viele Grüße
Jen

[jen]

Sorry, das muss natürlich <option selected> heißen.

[Steel]

Hallo!

Hallo zurueck!

Meine Frage bezieht sich auf den Kalender, den es auf SELFHTML gibt ( http://de.selfhtml.org/javascript/beispiele/monatskalender.htm ).

Wie setzte ich es um, dass der ausgewählte Tag, Monat und Jahr in eine Auswahlliste übergeben wird? Also die jeweilige <option select> ____ befüllt wird?
Und muss der Code dazu in die .htm des Kalenders oder der .htm, von der aus der Kalender mit javascript:newWindow() aufgerufen wird?

ich nehme mal an das Formular ist auf der Seite von der aus der Kalender geoeffnet wird. Dann ist window.opener immer dein Freund. (natuerlich im Kalender selbst)

Und Options kann man so bearbeiten:
http://de.selfhtml.org/javascript/objekte/options.htm

Schonmal danke und viele Grüße

keine Ursache, hoffe es hilft

Jen

[Steel]

PS:

Warum eine zweite Seite aufrufen und nicht den Kalender in die Seite integrieren? Popups gehen auch gut mit DIVs ...

[jen]

Danke schonmal!
Wie mache ich denn das mit den divs statt PopUps?

Irgendwie bekomme ich das nicht hin. Ich müsste ja quasi hier beim Kalender( http://de.selfhtml.org/javascript/beispiele/monatskalender.htm ):

function SchreibeZelle (Inhalt, HgFarbe, SchrFarbe, SchrGroesse, SchrArt) {
  document.write('<td align="center" valign="middle" bgcolor="' + HgFarbe + '">');
  document.write('<font size="' + SchrGroesse + '" color="' + SchrFarbe + '" face="' + SchrArt + '"><b>');
  document.write(Inhalt);
  document.write("</b></font></td>");
}

ein onclick="...; return Inhalt" einfügen, sehe ich das richtig? Was muss dann vor das return?
Und wie spreche ich das dann von meiner Seite aus an, auf der der Kalender mit window.open geöffnet wird?

[Steel]

Danke schonmal!
Wie mache ich denn das mit den divs statt PopUps?

Du erstellst einen container (z.B. ein Div) in dem der Code fuer den Kalender ist.. Das Teil platzierst Du wo du es gerne haettest und machst es unsichtbar. Auf Klick kannst du dann die sichtbarkeit regulieren. Natuerlick kann ein kleiner Kalender auch dauerhaft zu sehen sein. wie Du magst.

Irgendwie bekomme ich das nicht hin. Ich müsste ja quasi hier beim Kalender( http://de.selfhtml.org/javascript/beispiele/monatskalender.htm ):

function SchreibeZelle (Inhalt, HgFarbe, SchrFarbe, SchrGroesse, SchrArt) {
  document.write('<td align="center" valign="middle" bgcolor="' + HgFarbe + '">');
  document.write('<font size="' + SchrGroesse + '" color="' + SchrFarbe + '" face="' + SchrArt + '"><b>');
  document.write(Inhalt);
  document.write("</b></font></td>");
}

ein onclick="...; return Inhalt" einfügen, sehe ich das richtig? Was muss dann vor das return?
Und wie spreche ich das dann von meiner Seite aus an, auf der der Kalender mit window.open geöffnet wird?

Du koenntest die Zahlen verlinken. Du brauchst auch kein return, sondern kannst in dem Link einfach eine funktion aufrufen die dir dein Formular ausfuellt. entweder direkt wenn du kein PopUp benutzt oder ueber window.opener.

Aber im Ernst: Dieser Beispielkalender ist nur fuer Demozwecke gut. Man muss einiges dran rumdoktoren. Hast Du im Netz schonmal einen fertigern Codeschnipsel gesucht, der dir liefert, was Du suchst?

[jen]

Das mit dem div hat gut geklappt, danke! =)

Du koenntest die Zahlen verlinken.

Wie setze ich das denn um? Komme von allein irgendwie nicht drauf.

Dieser Beispielkalender ist nur fuer Demozwecke gut.

Und zum Javascript üben auch! ;)

Grüße

[Steel]

Und zum Javascript üben auch! ;)

Das stimmt! :) Das HTML mit dem der erstellt wird ist aber nicht so dolle. :)

Du kannst die Zellen mit einem OnClick versehen oder einfach die Zahlen in ein <a> tag packen. Beides sind Moeglichkeiten eine JavaScript Funktion aufzurufen.

Die Parameter generierst Du beim erstellen des Verweises gleich mit. Sowas wie >>onClick='myDate(Jahr, Monat, Tag)'<<
(statt Jahr, Monat, Tag halt die Variablen die das Datum bestimmen) in der Funktion nimmst Du die Parameter und schreibst sie rein wo du magst.

Ich persoenlich mag mit CSS formatierte <a> Tags. Mit dem richtigen CSS kann man damit alles moegliche anstellen. Mit onClick versehene Tabellenzellen sind natuerlich von vornherein gut anklickbar ohne dass man was dran formatieren muss.

Grüße

ebenfalls

[jen]

Hm, ich komme im Moment nicht so ganz weiter. Ich habe jetzt hier den a-Tag eingefügt. Sehe ich es richtig, dass Tageszahl, Monat und Jahr die Variablen sind, die ich dazu brauche?

function SchreibeZelle (Inhalt, HgFarbe, SchrFarbe, SchrGroesse, SchrArt) {
document.write('<td align="center" valign="middle" bgcolor="' + HgFarbe + '">');
document.write('<a href="javascript:selectDate(Tageszahl, Monat, Jahr)" style="text-decoration:none;"><font size="' + SchrGroesse + '" color="' + SchrFarbe + '" face="' + SchrArt + '"><b>');
document.write(Inhalt);
document.write("</b></a></font></td>");
}

Wie seiht dann meine Funktion aus?
Das select für den aktuellen Tag ist so:

document.reisedaten.SD.options[b_tag - 1].selected=true
document.reisedaten.SM.options[b_monat - 1].selected=true
document.reisedaten.SY.options[0].selected=true

Müsste die Funktion dann nicht in etwa so aussehen? (Bräuchte man dann die oberen 3 Anweisungen überhaupt? Und ist anstatt Tageszahl nicht doch Inhalt richtig? Oder muss ich doch eine Bezeichnung bzw. Indizierung generieren?)

function selectDate(Tageszahl, Monat, Jahr){
document.reisedaten.SD.options[b_tag - 1].selected=false
document.reisedaten.SM.options[b_monat - 1].selected=false
document.reisedaten.SY.options[0].selected=false

document.reisedaten.SD.options[Tageszahl].selected=true
document.reisedaten.SD.options[Monat].selected=true
document.reisedaten.SD.options[Jahr].selected=true
}

[Steel]

Ja. Du siehst das richtig. das sind die Variablen die du benoetigst.

Wie Du die Variablen in der Funktion nennst ist ja egal. Soweit ist bei Dir scheinbar alles ok. Nur musst du noch die Daten mit dem Funktionsaufruf uebergeben. Das tust Du grad so:

javascript:selectDate(Tageszahl, Monat, Jahr)

Das wird nicht gehen, ausser du hast noch nen Script laufen das die Variablen Tageszahl, Monat, Jahr aktualisiert. Wie heissen denn die Variablen im Kalenderscript? Es sieht ja z.B. so aus als wuerde die Variable 'Inhalt' benutzt um den Tag in die Zellen zu schreiben. Statt javascript:selectDate(Tageszahl, Monat, Jahr) wuerde sich also was als Funktionsaufruf eignen? Die Variablen Tageszaahl, Monat und Jahr scheint es ja nicht zu geben bisher...

Tipp: Bei dem Kalender sind Jahr und Monat bisher doch ziemlich fix, oder hast du da schon ne Blaetterfunktion eingebaut? ;)

Mal sehen wie weit Du jetzt kommst. Wuerd mich interessieren wie das endet. Vielleicht komm ich ja sogar am WE mal dazu hier reinzuschauen...

[jen]

Dein Interesse daran freut mich. =) Und Deine Hilfe natürlich noch mehr. ;)

Tipp: Bei dem Kalender sind Jahr und Monat bisher doch ziemlich fix, oder hast du da schon ne Blaetterfunktion eingebaut? ;)

Da bin ich gerade dabei, nur so ganz hinbekommen hab ich es noch nicht..
Meine Idee ist, eine Vraiable mc = 0 (bzw. -1, da ja die  Ordnung der Monate im Array immer 1 kleiner ist) zu setzen. Bei jedem Klick auf den "vor"-Button (ein .gif) wird dann eine funktion MonthCounter mit mc++ aufgerufen. Analog dazu zurück: mc--.
Ich erzeuge dann den Kalender nicht mehr mit dem Monat, sondern mit dem Monat + mc.
Veränderungen sind jetzt diese:

function Kalender (Monat, Jahr) {
...
var mc = -1;
var Wahlmonat = Monat + mc;
...
var Zeit = new Date(Jahr, Wahlmonat, 1);

function SchreibeKopf (Monatstitel, HgFarbe, SchrFarbe, SchrGroesse, SchrArt) {
document.write("<tr>");
document.write('<td><a href="javascript:monthBack()" onclick="javascript:monthCounterB()"><img src="..."></a></td>');
document.write('...');
document.write('...');
document.write(Monatstitel);
document.write('</b></td><td><a href="javascript:monthForward();" onclick="javascript:monthCounterF(mc)"><img src="..."></a></td></font></tr>');
...

function selectDate(){
document.reisedaten.ED.options[Inhalt].selected=true
document.reisedaten.EM.options[Wahlmonat].selected=true
document.reisedaten.EY.options[Jahr].selected=true
}

function monthCounterF(mc){
mc++;
return mc;
}

Dann muss ich den Kalender in der Funktion monthForward ja quasi aktualisieren. Wie mache ich das? Muss ich darin einfach die Funktion  Kalender aufrufen? Weil das hat nicht so wirklich geklappt, vielleicht war aber auch was anderes falsch.
Wie muss function monthForward(){} aussehen?

Den Jahreswechsel mache ich dann, wenn das mit dem Monat klappt.

Wenn Du Dich mal so bei mir melden magst: ICQ #253187744

[Steel]

Hiho,
ein langes WE spaeter:

Meine Idee ist, eine Vraiable mc = 0 (bzw. -1, da ja die  Ordnung der Monate im Array immer 1 kleiner ist) zu setzen. Bei jedem Klick auf den "vor"-Button (ein .gif) wird dann eine funktion MonthCounter mit mc++ aufgerufen. Analog dazu zurück: mc--.

Das klingt dooch schonmal nach nem Konzept.

Ich erzeuge dann den Kalender nicht mehr mit dem Monat, sondern mit dem Monat + mc.

Aha... Warum? Macht das Sinn? Wenn MC schon quasi der Monat ist, zu was addierst Du dann noch Monat? Versuch mal mc und Monat zu einer einzigen Variablen zu machen. (die auch gern global sein darf)
Dabei macht es Sinn das Array erstmal zu vergessen und die Monate so zu zaehlen, dass Das Datumsobjekt damit was anfangen kann.

Veränderungen sind jetzt diese:

function Kalender (Monat, Jahr) {
...
var mc = -1;
var Wahlmonat = Monat + mc;
...
var Zeit = new Date(Jahr, Wahlmonat, 1);

Wie gesagt, ueberdenk das nochmal.

function SchreibeKopf (Monatstitel, HgFarbe, SchrFarbe, SchrGroesse, SchrArt) {
document.write("<tr>");
document.write('<td><a href="javascript:monthBack()" onclick="javascript:monthCounterB()"><img src="..."></a></td>');
document.write('...');
document.write('...');
document.write(Monatstitel);
document.write('</b></td><td><a href="javascript:monthForward();" onclick="javascript:monthCounterF(mc)"><img src="..."></a></td></font></tr>');
...

Das sieht soweit schonmal nuetzlich aus.

function selectDate(){
document.reisedaten.ED.options[Inhalt].selected=true
document.reisedaten.EM.options[Wahlmonat].selected=true
document.reisedaten.EY.options[Jahr].selected=true
}

function monthCounterF(mc){
mc++;
return mc;
}

die sollte doch eingentlich monthForward() heissen? Und zu was ist das return gut? Du gibst ja nichts zurueck, wie es aussieht.

Dann muss ich den Kalender in der Funktion monthForward ja quasi aktualisieren. Wie mache ich das? Muss ich darin einfach die Funktion  Kalender aufrufen? Weil das hat nicht so wirklich geklappt, vielleicht war aber auch was anderes falsch.

Eigentlich muss wirklich nur die Funktion nochmal aufgerufen werden. Aber denk mal drueber nach, was die macht. Bisher knallt sie einfach beim schreiben des Dokuments mit ihren document Writes den Kalender ins Dokument. Das ist natuerlich nicht sehr nuetzlich, wenn das dynamisch gemacht werden soll. Beschaeftige dich z.B. mal mit innerHTML und freunde dich schonmal mit dem Gedanken an, deine komplette Kalenderfunktion umzubauen. :)

Wie muss function monthForward(){} aussehen?

Genau so wie da oben:
function monthForward()
{
  mc++;
}
Diese hier arbeitet mit einem globalen mc (Monat) Ansonsten halt noch die Variable uebergeben und eventuell mit Return wieder zurueckgeben. Alternativ, wenn Du das mit dem Array gleich mitloesen wilst bietet es sich an eine Variable Monat und eine Variable mc parallel laufen zu lassen. in Monat waere dann der Monat fuer das Datumsobjekt und in mc der Wert zum Array auslesen:

function monthForward()
{
  Monat++;
  mc++; (oder mc=Monat-1, damit bist du immer auf der sicheren Seite, falls mc mal wo nicht aktualisiert wird)
}

Den Jahreswechsel mache ich dann, wenn das mit dem Monat klappt.

gute Idee. Immer schoen Schritt fuer Schritt.

Wenn Du Dich mal so bei mir melden magst: ICQ #253187744

hab ich mir mal notiert. Ist aber selten ne gute Idee sowas oeffentlich zu posten.

So, mal sehen was draus wird. Etwas Javascript lernst Du auf alle Faelle dabei den SelfHTML Kalender in etwas nutzbares umzuwandeln. :)

Gruss