te new DateField with default date format: 'dd MMM yyyy' DateField dateField = new DateField("date"); // You can change the format to: 'yyyy-MM-dd' dateField.setFormatPattern("yyyy-MM-dd"); // Finally add dateField to form form.add(dateField); addControl(form); } }
CSS and JavaScript resources
The Calendar popup is provided by the
Prototype based
CalendarDateSelect library.
Please note: if you don't want to have a dependency on the Prototype library you can use the
Click Calendar CalendarField which is based on the
Dynarch.com library. Consider this option when using an alternative JavaScript library than Prototype, such as
JQuery.
Alternatively you can switch off the Calendar popup by setting the {@link #setShowCalendar(boolean)} to false. No JavaScript and CSS will beincluded when this option is false.
The DateFielld control makes use of the following resources (which Click automatically deploys to the application directories,
/click/calendar and
/click/prototype):
- click/calendar/{style}.css - where {style} is a specific Calendar style e.g. default, red, blue etc.
- click/prototype/prototype.js
- click/calendar/calendar_date_select.js
- click/calendar/{lang}.js - where {lang} is the language specified by the browser e.g. fr (French), de (German) etc.
The Calendar popup is created as a <div> element using JavaScript. To enable the Calendar popup, reference
$headElements and
$jsElements in the page template. For example:
<html> <head> $headElements </head> <body> $form $jsElements </body> </html>
Calendar Styles
The default Calendar style is 'default' which has a gray theme. The Calendar styles include:
- blue
- default
- plain
- red
- silver
See also W3C HTML reference
INPUT