Differences

This shows you the differences between two versions of the page.

deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:kalender:datum-mit-js-kalender-2 [2009/11/04 11:14]
Knut Heermann (flip-flop)
deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:kalender:datum-mit-js-kalender-2 [2018/06/03 18:08] (current)
Line 1: Line 1:
{{indexmenu_n>20}} {{indexmenu_n>20}}
-====== Datumeing. mit JS Kalender ======+====== 2) Datumeing. mit JS Kalender ======
-**Ein JS Kalender, der die Datumeingabe mit Prüfung in ein Formularfeld erlaubt. Diese Variante stellt auch das manelle Eingabefeld mit ausgeschaltetem JS bereit.** \\+**Ein JS Kalender, der die Datumeingabe mit Prüfung in ein Formularfeld erlaubt. Diese Variante stellt auch das manuelle Eingabefeld bei ausgeschaltetem JS bereit.** \\
\\ \\
Line 14: Line 14:
JavaScript DHMTL Kalenderauswahl. Erzeugt einen klickbaren Button JavaScript DHMTL Kalenderauswahl. Erzeugt einen klickbaren Button
hinter Eingabefeldern, über die mit einem Office-ähnlichen Kalender hinter Eingabefeldern, über die mit einem Office-ähnlichen Kalender
-das Datum ausgewählt werden kann, dass dann in das entsprechende+das Datum ausgewählt werden kann, das dann in das entsprechende
Eingabefeld eingetragen wird. Eingabefeld eingetragen wird.
Line 44: Line 44:
---- ----
-Download: {{:deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:kalender:calpick.zip|calpick.zip}} //Patch for phpwcms//+**Download:** {{:deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:kalender:calpick.zip|calpick.zip}} //Patch for phpwcms: Pfad fest eingetragen, Umlaute im text für UTF-8 korrigiert//
Line 152: Line 152:
===== Frontendausgabe ===== ===== Frontendausgabe =====
-Einfaches Formular mit Datumeingabe: \\ +Einfaches Formular mit Datumeingabe //(Datumfeld erscheint auch ohne JS)//: \\ 
-{{:deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:kalender:calendardateinput_fe01_01.gif|}}+{{:deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:kalender:calpick_fe_01_01.gif|}}
===== Arbeitsweise: ===== ===== Arbeitsweise: =====
Line 175: Line 175:
**Die Vorlage** sieht für den Kalender so aus: **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][BR]{date_input} 
-<script>DateInput('date_input', true, 'DD.MM.YYYY')</script>+<script> 
 +//<![CDATA[ 
 +AttachCalendarButton(document.phpwcmsForm{CPID}.date_input)
 +//]]> 
 +</script>
</code> </code>
\\ \\
Line 182: Line 186:
<code php> <code php>
[PHP] [PHP]
-$GLOBALS['block']['custom_htmlhead']['calendarDateInputX.js']= getJavaScriptSourceLink('template/inc_js/calendarDateInput/calendarDateInputX.js');+$GLOBALS['block']['custom_htmlhead']['calpick.js']= getJavaScriptSourceLink('template/inc_js/calpick/calpick.js');
[/PHP] [/PHP]
</code> </code>
Line 189: Line 193:
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]])// 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/calpick/calpick.js"
\\ \\
Line 205: Line 209:
==== BE Vorlage ==== ==== BE Vorlage ====
-{{:deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:kalender:calendardateinput04_01.gif|}}+{{:deutsch:phpwcms-system:artikel:contentparts:formular:spezielle-anwendungen:kalender:calpick_be_04_01.gif|}}
\\ \\
Line 236: Line 240:
<code html|h Vorlage |h> <code html|h Vorlage |h>
-<div style="width:610px; margin: 0; padding:10px; border-top:1px dotted #bbb; border-bottom:1px dotted #bbb; background: #f0f0f0;">+<div style="width:610px; margin: 0; padding:10px; border-top:1px dotted #bbb; border-bottom:1px dotted #bbb; background: #f6f6f6;">
{ERROR:name}[B]{LABEL:name}[/B][BR]{name}[BR][BR] {ERROR:name}[B]{LABEL:name}[/B][BR]{name}[BR][BR]
Line 245: Line 249:
-{ERROR:date_input}[B]{LABEL:date_input}[/B] +{ERROR:date_input}[B]{LABEL:date_input}[/B][BR]{date_input} 
-<script>DateInput('date_input', true, 'DD.MM.YYYY')</script>+<script> 
 +//<![CDATA[ 
 +AttachCalendarButton(document.phpwcmsForm{CPID}.date_input)
 +//]]> 
 +</script>
[BR][BR] [BR][BR]
Line 257: Line 265:
[PHP] [PHP]
-$GLOBALS['block']['custom_htmlhead']['calendarDateInputX.js']= getJavaScriptSourceLink('template/inc_js/calendarDateInput/calendarDateInputX.js');+$GLOBALS['block']['custom_htmlhead']['calpickVar'] = '<script type="text/javascript">'.LF; 
 +$GLOBALS['block']['custom_htmlhead']['calpickVar'].= '//<![CDATA['.LF; 
 +$GLOBALS['block']['custom_htmlhead']['calpickVar'].= 'var _calImageAlign = "top";'.LF; 
 +$GLOBALS['block']['custom_htmlhead']['calpickVar'].= 'var _calTopDistance = 5;'.LF; 
 +$GLOBALS['block']['custom_htmlhead']['calpickVar'].= 'var _calImageStyle = "margin-top:" + _calTopDistance + "px";'.LF; 
 +$GLOBALS['block']['custom_htmlhead']['calpickVar'].= '//]]>'.LF; 
 +$GLOBALS['block']['custom_htmlhead']['calpickVar'].= '</script>'.LF; 
 + 
 +$GLOBALS['block']['custom_htmlhead']['calpick.js']= getJavaScriptSourceLink('template/inc_js/calpick/calpick.js');
[/PHP] [/PHP]
</code> </code>
deutsch/phpwcms-system/artikel/contentparts/formular/spezielle-anwendungen/kalender/datum-mit-js-kalender-2.1257329657.txt.gz · Last modified: 2018/06/03 18:07 (external edit)
www.planmatrix.de www.chimeric.de Creative Commons License Valid CSS Driven by DokuWiki do yourself a favour and use a real browser - get firefox!! Recent changes RSS feed Valid XHTML 1.0