forked from silverstripe/silverstripe-framework
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
FIX DateField Calendar - make dates with day- and monthnames validate
In locales other than en_US, as a result of missing jQuery locale files, the DatePicker defaulted to English whenever day and monthnames were used, breaking validation. Needed to change official locale files before adding, because Zend_Date and jQuery day/monthnames not matching again breaks validation. Removed hard setting the names to uppercase, breaking validation for other locales Changed order in convert_iso_to_jquery_format(), to prevent EEE(E) settings from being overwritten Added a check for existing locale files, and made DatePicker fallback to ISO yyy-MM-dd if a missing locale file would otherwise break validation. Added documentation for the DateField
- Loading branch information
Showing
12 changed files
with
428 additions
and
22 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,131 @@ | ||
# DateField | ||
|
||
## Introduction | ||
|
||
This `FormField` subclass lets you display an editable date, either in | ||
a single text input field, or in three separate fields for day, month and year. | ||
It also provides a calendar datepicker. | ||
|
||
## Adding a DateField | ||
|
||
The following example will add a simple DateField to your Page, allowing you to | ||
enter a date manually. | ||
|
||
:::php | ||
class Page extends SiteTree { | ||
static $db = array( | ||
'MyDate' => 'Date', | ||
); | ||
|
||
public function getCMSFields() { | ||
$fields = parent::getCMSFields(); | ||
$fields->addFieldToTab( | ||
'Root.Main', | ||
$myDate = new DateField('MyDate', 'Enter a date') | ||
); | ||
return $fields; | ||
} | ||
} | ||
|
||
## Custom Dateformat | ||
|
||
You can define a custom dateformat for your Datefield based on [Zend_Date constants](http://framework.zend.com/manual/1.12/en/zend.date.constants.html). | ||
|
||
:::php | ||
// will display a date in the following format: 31-06-2012 | ||
DateField::create('MyDate')->setConfig('dateformat', 'dd-MM-yyyy'); | ||
|
||
|
||
## Min and Max Dates | ||
|
||
Set the minimum and maximum allowed datevalues using the `min` and `max` | ||
configuration settings (in ISO format or strtotime() compatible). Example: | ||
|
||
:::php | ||
DateField::create('MyDate') | ||
->setConfig('min', '-7 days') | ||
->setConfig('max', '2012-12-31') | ||
## Separate Day/Month/Year Fields | ||
|
||
The following setting will display your DateField as `three input fields` for | ||
day, month and year separately. Any custom dateformat settings will be ignored. | ||
HTML5 placeholders 'day', 'month' and 'year' are enabled by default. | ||
|
||
:::php | ||
DateField::create('MyDate') | ||
->setConfig('dmyfields', true); | ||
->setConfig('dmyseparator', '/') // set the separator | ||
->setConfig('dmyplaceholders', 'true'); // enable HTML 5 Placeholders | ||
|
||
## Calendar Field | ||
|
||
The following setting will add a Calendar to a single DateField, using the | ||
`jQuery UI DatePicker widget` | ||
|
||
:::php | ||
DateField::create('MyDate')->setConfig('showcalendar', true); | ||
|
||
|
||
### 'Safe' Dateformats to Use with the Calendar | ||
|
||
The jQuery DatePicker doesn't support every constant available for Zend_Date. | ||
If you choose to use the calendar, the following constants should at least be safe: | ||
|
||
Constant | xxxxx | ||
-------- | ----- | ||
d | numeric day of the month (without leading zero) | ||
dd | numeric day of the month (with leading zero) | ||
EEE | dayname, abbreviated | ||
EEEE | dayname | ||
M | numeric month of the year (without leading zero) | ||
MM | numeric month of the year (with leading zero) | ||
MMM | monthname, abbreviated | ||
MMMM | monthname | ||
y | year (4 digits) | ||
yy | year (2 digits) | ||
yyyy | year (4 digits) | ||
|
||
### Calendar localization issues | ||
|
||
Unfortunately the day- and monthname values in Zend Date do not always match | ||
those in the existing jQuery UI locale files, so constants like `EEE` or `MMM`, | ||
for day and monthnames could break validation. To fix this we had to slightly | ||
alter the jQuery locale files, situated in | ||
*/framework/thirdparty/jquery-ui/datepicker/i18n/*, to match Zend_Date. | ||
|
||
At this moment not all locale files may be present. If a locale file is | ||
missing, the DatePicker calendar will fallback to 'yyyy-MM-dd' whenever day- | ||
and/or monthnames are used. After saving, the correct format will be displayed. | ||
|
||
## Contributing jQuery Locale Files | ||
|
||
If you find the jQuery locale file for your chosen locale is missing, the | ||
following section will explain how to create one. If you wish to contribute | ||
your file to the SilverStripe core, please check out the guide on | ||
['contributing code'](http://doc.silverstripe.org/framework/en/trunk/misc/contributing/code). | ||
|
||
### 1. Get the Sourcefile | ||
|
||
You can find a list of locale files for the jQuery UI DatePicker | ||
[in the jQuery source code](https://github.com/jquery/jquery-ui/tree/master/ui/i18n). | ||
|
||
### 2. Find your Zend Locale File | ||
|
||
The Zend locale files are located in */framework/thirdparty/Zend/Locale/Data/*. | ||
Find the one that has the information for your locale. | ||
|
||
### 3. Find the Date Values | ||
|
||
You're looking for the `Gregorian` date values for monthnames and daynames in | ||
the Zend locale file. Edit the DatePicker locale File so your *full day- and | ||
monthnames* and *short monthnames* match. For your *short daynames*, use the | ||
first three characters of the full name. Note that Zend dates are `case | ||
sensitive`! | ||
|
||
### 4. Filename | ||
|
||
Use the original jQuery UI filename 'jquery.ui.datepicker-xx.js', where xx | ||
stands for the locale. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
AUTHOR: Martine Bloem (http://www.balbuss.com) | ||
********************************************** | ||
|
||
jQuery UI DatePicker localization files for SilverStripe 3.0 | ||
------------------------------------------------------------ | ||
These files are adaptations of the official localization files that can be found here: | ||
http://jquery-ui.googlecode.com/svn/trunk/ui/i18n/ | ||
|
||
Day- and monthnames have been changed to match the values Zend Date uses, to make | ||
the following dateformats validate: | ||
|
||
EEE: weekday short | ||
EEEE: weekday | ||
MMM: monthname short | ||
MMMM: monthname | ||
|
||
For locales for which no file exists (yet), the DatePicker will revert to a numeric | ||
format, that will validate, and after being saved will be displayed in the | ||
required format. | ||
|
||
To create your own language fiel, download the original file from the URL above, | ||
find the Zend Date locale file in framework/Zend/Locale/Data and make sure that | ||
|
||
- monthNames, monthNamesShort and dayNames are equivalent to Zend (Gregorian) names | ||
- dayNamesShort should be the first 3 characters of dayNames |
25 changes: 25 additions & 0 deletions
25
thirdparty/jquery-ui/datepicker/i18n/jquery.ui.datepicker-da.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
/* | ||
* Danish (UTF-8) initialisation for the jQuery UI date picker plugin. | ||
* Adapted to match the Zend Data localization for SilverStripe CMS | ||
* See: README | ||
*/ | ||
jQuery(function($){ | ||
$.datepicker.regional['da'] = { | ||
closeText: 'Luk', | ||
prevText: '<Forrige', | ||
nextText: 'Næste>', | ||
currentText: 'Idag', | ||
monthNames: ['januar','februar','marts','april','maj','juni','juli','august','september','oktober','november','december'], | ||
monthNamesShort: ['jan.','feb.','mar.','apr.','maj','jun.','jul.','aug.','sep.','okt.','nov.','dec.'], | ||
dayNames: ['søndag','mandag','tirsdag','onsdag','torsdag','fredag','lørdag'], | ||
dayNamesShort: ['søn','man','tir','ons','tor','fre','lør'], | ||
dayNamesMin: ['Sø','Ma','Ti','On','To','Fr','Lø'], | ||
weekHeader: 'Uge', | ||
dateFormat: 'dd-mm-yy', | ||
firstDay: 1, | ||
isRTL: false, | ||
showMonthAfterYear: false, | ||
yearSuffix: ''}; | ||
$.datepicker.setDefaults($.datepicker.regional['da']); | ||
}); | ||
|
25 changes: 25 additions & 0 deletions
25
thirdparty/jquery-ui/datepicker/i18n/jquery.ui.datepicker-de.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
/* | ||
* German (UTF-8) initialisation for the jQuery UI date picker plugin. | ||
* Adapted to match the Zend Data localization for SilverStripe CMS | ||
* See: README | ||
*/ | ||
jQuery(function($){ | ||
$.datepicker.regional['de'] = { | ||
closeText: 'schließen', | ||
prevText: '<zurück', | ||
nextText: 'Vor>', | ||
currentText: 'heute', | ||
monthNames: ['Januar','Februar','März','April','Mai','Juni','Juli','August','September','Oktober','November','Dezember'], | ||
monthNamesShort: ['Jan','Feb','Mär','Apr','Mai','Jun','Jul','Aug','Sep','Okt','Nov','Dez'], | ||
dayNames: ['Sonntag','Montag','Dienstag','Mittwoch','Donnerstag','Freitag','Samstag'], | ||
dayNamesShort: ['Son','Mon','Die','Mit','Don','Fre','Sam'], | ||
dayNamesMin: ['So','Mo','Di','Mi','Do','Fr','Sa'], | ||
weekHeader: 'Wo', | ||
dateFormat: 'dd.mm.yy', | ||
firstDay: 1, | ||
isRTL: false, | ||
showMonthAfterYear: false, | ||
yearSuffix: ''}; | ||
$.datepicker.setDefaults($.datepicker.regional['de']); | ||
}); | ||
|
24 changes: 24 additions & 0 deletions
24
thirdparty/jquery-ui/datepicker/i18n/jquery.ui.datepicker-en-GB.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,24 @@ | ||
/* | ||
* English/UK (UTF-8) initialisation for the jQuery UI date picker plugin. | ||
* Adapted to match the Zend Data localization for SilverStripe CMS | ||
* See: README | ||
*/ | ||
jQuery(function($){ | ||
$.datepicker.regional['en-GB'] = { | ||
closeText: 'Done', | ||
prevText: 'Prev', | ||
nextText: 'Next', | ||
currentText: 'Today', | ||
monthNames: ['January','February','March','April','May','June','July','August','September','October','November','December'], | ||
monthNamesShort: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], | ||
dayNames: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'], | ||
dayNamesShort: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'], | ||
dayNamesMin: ['Su','Mo','Tu','We','Th','Fr','Sa'], | ||
weekHeader: 'Wk', | ||
dateFormat: 'dd/mm/yy', | ||
firstDay: 1, | ||
isRTL: false, | ||
showMonthAfterYear: false, | ||
yearSuffix: ''}; | ||
$.datepicker.setDefaults($.datepicker.regional['en-GB']); | ||
}); |
25 changes: 25 additions & 0 deletions
25
thirdparty/jquery-ui/datepicker/i18n/jquery.ui.datepicker-en.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
/* | ||
* English (UTF-8) initialisation for the jQuery UI date picker plugin. | ||
* Adapted to match the Zend Data localization for SilverStripe CMS | ||
* See: README | ||
*/ | ||
jQuery(function($){ | ||
$.datepicker.regional['en'] = { | ||
closeText: 'Done', | ||
prevText: 'Prev', | ||
nextText: 'Next', | ||
currentText: 'Today', | ||
monthNames: ['January','February','March','April','May','June','July','August','September','October','November','December'], // For formatting | ||
monthNamesShort: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], // For formatting | ||
dayNames: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'], // For formatting | ||
dayNamesShort: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'], // For formatting | ||
dayNamesMin: ['Su','Mo','Tu','We','Th','Fr','Sa'], | ||
weekHeader: 'Wk', | ||
dateFormat: 'mm/dd/yy', | ||
firstDay: 0, | ||
isRTL: false, | ||
showMonthAfterYear: false, | ||
yearSuffix: '' | ||
$.datepicker.setDefaults($.datepicker.regional['en']); | ||
}); | ||
|
Oops, something went wrong.