NAVIGATION
This shows you the differences between two versions of the page.
|
deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:kalender:datum-mit-js-kalender [2009/11/03 19:33] Knut Heermann (flip-flop) |
deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:kalender:datum-mit-js-kalender [2018/06/03 18:08] (current) |
||
|---|---|---|---|
| Line 1: | Line 1: | ||
| - | {{indexmenu_n>400}} | + | {{indexmenu_n>10}} |
| - | ====== Datumeingabe mit JS Kalender ====== | + | ====== 1) Datumeing. mit JS Kalender ====== |
| - | **Ein JS Kalender, der die Datumeingabe mit Prüfung in ein Formularfeld erlaubt.** \\ | + | **Ein JS Kalender, der die Datumeingabe mit Prüfung in ein Formularfeld erlaubt. Die manuellen Eingabefelder werden nur bei eingeschaltetem JS generiert!!** \\ |
| \\ | \\ | ||
| Line 9: | Line 9: | ||
| * [[http://www.dynamicdrive.com/dynamicindex7/jasoncalendar.htm#at|Jason's Date Input Calendar]] | * [[http://www.dynamicdrive.com/dynamicindex7/jasoncalendar.htm#at|Jason's Date Input Calendar]] | ||
| * [[http://calendar.moonscript.com/dateinput.cfm|Jason Moon's Fool-Proof Date Input Calendar Script]] | * [[http://calendar.moonscript.com/dateinput.cfm|Jason Moon's Fool-Proof Date Input Calendar Script]] | ||
| - | * [[http://flocke.vssd.de/prog/code/js/calpick/|Alternative: calpick.js]] - Inspiriert vom und mit konzeptionellen Anleihen beim Kalender-Element von Jason Moon | + | |
| + | Alternativen, die mit dieser hier gezeigten Grundtechnik auch funktionieren sollten: | ||
| + | * [[http://flocke.vssd.de/prog/code/js/calpick/|calpick.js]] - Mit konzeptionellen Anleihen beim Kalender-Element von Jason Moon | ||
| + | * [[http://dev.base86.com/scripts/datepicker_calendar_eightysix.html|Calender Eightysix]] //(Ajax and Mootools v1.2.3)// | ||
| \\ | \\ | ||
| Line 19: | Line 22: | ||
| **CMS-Version:** >= V1.3.x \\ | **CMS-Version:** >= V1.3.x \\ | ||
| **Version:** V1.0 //30.10.09// \\ | **Version:** V1.0 //30.10.09// \\ | ||
| + | \\ | ||
| + | ---- | ||
| - | Download: {{:deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:calendardateinput.zip|calendardateinput.js}} //Patch for german date form DD.MM.YYY// | + | **Bedingung:** -> [[http://www.phpwcms-docu.de/confincphp_de.phtml|/config/phpwcms/conf.inc.php]] \\ |
| + | * $phpwcms['allow_cntPHP_rt'] = 1; | ||
| + | **Bedingung:** -> Datum umstellen in %%/config/phpwcms/conf.template_default.inc.php%%, siehe [[http://forum.phpwcms.org/viewtopic.php?p=132838#p132838|Re: Datumeingabe für Formular-Contenttype]]\\ | ||
| + | * %%$template_default['date']['short'] = 'd.m.Y';%% | ||
| + | |||
| + | |||
| + | \\ | ||
| + | |||
| + | ---- | ||
| + | Download: {{:deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:kalender:calendardateinput.zip|calendardateinput.js}} //Patch for german date form DD.MM.YYY// | ||
| **Update: V1.1 03.11.2009** \\ | **Update: V1.1 03.11.2009** \\ | ||
| - | Download: {{:deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:calendardateinputX.zip|calendarDateInputX.js}} //Patch for german date form DD.MM.YYY, Week number (DIN 1355 / ISO 8601) and many custom vars.// | + | **Download:** {{:deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:kalender:calendardateinputX.zip|calendarDateInputX.js}} //Patch for german date form DD.MM.YYY, Week number (DIN 1355 / ISO 8601) and many custom vars.// |
| + | ---- | ||
| \\ | \\ | ||
| - | **Möglichkeiten:** | + | |
| + | |||
| + | ===== Möglichkeiten: ===== | ||
| + | |||
| + | * Sprache nach deutsch umstellbar (Texte und z.B. Formfeld: **[Tag][Monat][Jahr]** anstatt [**Monat][Tag][Jahr]** | ||
| + | * Wochenstarttag bestimmbar, Sonntag oder Montag | ||
| + | * Ausgabe Kalenderwoche optional | ||
| + | * Datumsformat DD.MM.YYYY möglich | ||
| + | * Grafiken bestimmbar | ||
| + | * Viele Werte wie Font, Größe, Farben einstellbar | ||
| + | |||
| + | Die Einstellungen werden am Anfang der JS-Datei vorgenommen. | ||
| <code js|h Einstellungen |h> | <code js|h Einstellungen |h> | ||
| Line 112: | Line 138: | ||
| Einfaches Formular mit Datumeingabe: \\ | Einfaches Formular mit Datumeingabe: \\ | ||
| - | {{:deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:calendardateinput_fe01_01.gif|}} | + | {{:deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:kalender:calendardateinput_fe01_01.gif|}} |
| ===== Arbeitsweise: ===== | ===== Arbeitsweise: ===== | ||
| - | Das Skript generiert ein verstecktes Feld mit eingetragenem Ergebnis, dieses versteckte Feld muss im CP mit dem richtigen Namen angelegt werden. | + | Das Skript generiert ein verstecktes Feld mit eingetragenem Ergebnis, dieses versteckte Feld muss im CP mit identischem Namen angelegt werden. |
| - | Für das Feld wird **Text (spezial)** dringend empfohlen, da wir hier die Möglichkeit haben Falscheingaben abzufangen: | + | Für den Feldtyp wird **Text (spezial)** dringend empfohlen, da wir hier die Möglichkeit haben Falscheingaben abzufangen: |
| **Text (spezial)** mit dem Namenseintrag **date_input** und diesen Werteinträgen: | **Text (spezial)** mit dem Namenseintrag **date_input** und diesen Werteinträgen: | ||
| Line 128: | Line 154: | ||
| //(Siehe Bild unten)// | //(Siehe Bild unten)// | ||
| - | Die Vorlage sieht für den Kalender so aus: | + | |
| + | Den Feldnamen **date_input** finden wir im Skriptaufruf wieder. | ||
| + | |||
| + | |||
| + | **Die Vorlage** sieht für den Kalender so aus: | ||
| <code html> | <code html> | ||
| {ERROR:date_input}[B]{LABEL:date_input}[/B] | {ERROR:date_input}[B]{LABEL:date_input}[/B] | ||
| <script>DateInput('date_input', true, 'DD.MM.YYYY')</script> | <script>DateInput('date_input', true, 'DD.MM.YYYY')</script> | ||
| </code> | </code> | ||
| + | \\ | ||
| Am Ende des Vorlagenfeldes wird die JS-Datei eingebunden: | Am Ende des Vorlagenfeldes wird die JS-Datei eingebunden: | ||
| <code php> | <code php> | ||
| Line 141: | Line 172: | ||
| //(Siehe Bild unten)// | //(Siehe Bild unten)// | ||
| - | Die JS-Datei wird nur für das Formular hinzugelinkt, also nicht fest im Seiten-Template eingetragen. | + | Die JS-Datei wird nur für das Formular hinzugelinkt, also nicht fest im Seiten-Template eingetragen. //(siehe hierzu auch: [[deutsch:technik:aufruf-interner-funktionen:skript-in-den-head-bereich]])// |
| Das Skript liegt in "template/inc_js/calendarDateInput/calendarDateInputX.js" | Das Skript liegt in "template/inc_js/calendarDateInput/calendarDateInputX.js" | ||
| \\ | \\ | ||
| + | |||
| ==== BE Formular ==== | ==== BE Formular ==== | ||
| - | {{:deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:calendardateinput02_01.gif|}} | + | {{:deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:kalender:calendardateinput02_01.gif|}} |
| ==== BE Vorlage Empfänger ==== | ==== BE Vorlage Empfänger ==== | ||
| - | {{:deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:calendardateinput03_01.gif|}} | + | //(Ziemlich unsinniges Beispiel)// |
| + | |||
| + | {{:deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:kalender:calendardateinput03_01.gif|}} | ||
| ==== BE Vorlage ==== | ==== BE Vorlage ==== | ||
| - | {{:deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:calendardateinput04_01.gif|}} | + | {{:deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:kalender:calendardateinput04_01.gif|}} |
| \\ | \\ | ||