mirror of
https://github.com/silverstripe/silverstripe-framework
synced 2024-10-22 14:05:37 +02:00
ENHANCEMENT Using jQuery UI datepicker in CalendarDateField
API CHANGE Removed javascript datepicker functionality in DMYCalendarDateField git-svn-id: svn://svn.silverstripe.com/silverstripe/open/modules/sapphire/trunk@92512 467b73ca-7a2a-4603-9d3b-597d59a354a9
This commit is contained in:
parent
e233b4b76b
commit
b1baa84efb
@ -5,45 +5,64 @@
|
||||
* @subpackage fields-datetime
|
||||
*/
|
||||
class CalendarDateField extends DateField {
|
||||
|
||||
protected $futureOnly;
|
||||
|
||||
static function HTMLField( $id, $name, $val ) {
|
||||
return <<<HTML
|
||||
<input type="text" id="$id" name="$name" value="$val" />
|
||||
<img src="sapphire/images/calendar-icon.gif" id="$id-icon" alt="Calendar icon" />
|
||||
<div class="calendarpopup" id="$id-calendar"></div>
|
||||
HTML;
|
||||
}
|
||||
|
||||
function Field() {
|
||||
Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/prototype/prototype.js');
|
||||
Requirements::javascript(SAPPHIRE_DIR . "/thirdparty/behaviour/behaviour.js");
|
||||
Requirements::javascript(THIRDPARTY_DIR . "/calendar/calendar.js");
|
||||
Requirements::javascript(THIRDPARTY_DIR . "/calendar/lang/calendar-en.js");
|
||||
Requirements::javascript(THIRDPARTY_DIR . "/calendar/calendar-setup.js");
|
||||
Requirements::css(SAPPHIRE_DIR . "/css/CalendarDateField.css");
|
||||
Requirements::css(THIRDPARTY_DIR . "/calendar/calendar-win2k-1.css");
|
||||
// javascript: core
|
||||
Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/jquery/jquery.js');
|
||||
Requirements::javascript(SAPPHIRE_DIR . '/javascript/jquery_improvements.js');
|
||||
Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/jquery-ui/ui.core.js');
|
||||
Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/jquery-ui/ui.datepicker.js');
|
||||
Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/jquery-metadata/jquery.metadata.js');
|
||||
|
||||
$id = $this->id();
|
||||
$val = $this->attrValue();
|
||||
// javascript: localized datepicker
|
||||
// Include
|
||||
$candidates = array(
|
||||
i18n::convert_rfc1766(i18n::get_locale()),
|
||||
i18n::get_lang_from_locale(i18n::get_locale())
|
||||
);
|
||||
foreach($candidates as $candidate) {
|
||||
$datePickerI18nPath = sprintf(SAPPHIRE_DIR . '/thirdparty/jquery-ui/i18n/ui.datepicker-%s.js', $candidate);
|
||||
if(Director::fileExists($datePickerI18nPath)) Requirements::javascript($datePickerI18nPath);
|
||||
}
|
||||
|
||||
$futureClass = $this->futureOnly ? ' futureonly' : '';
|
||||
|
||||
$innerHTML = self::HTMLField( $id, $this->name, $val );
|
||||
// javascript: concrete
|
||||
Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/jquery-concrete/jquery.class.js');
|
||||
Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/jquery-concrete/jquery.selector.js');
|
||||
Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/jquery-concrete/jquery.selector.specifity.js');
|
||||
Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/jquery-concrete/jquery.selector.matches.js');
|
||||
Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/jquery-concrete/jquery.dat.js');
|
||||
Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/jquery-concrete/jquery.concrete.js');
|
||||
|
||||
return <<<HTML
|
||||
<div class="calendardate$futureClass">
|
||||
$innerHTML
|
||||
</div>
|
||||
HTML;
|
||||
// javascript: custom
|
||||
Requirements::javascript(SAPPHIRE_DIR . '/javascript/CalendarDateField.js');
|
||||
|
||||
// css: core
|
||||
Requirements::css(SAPPHIRE_DIR . '/thirdparty/jquery-ui-themes/smoothness/ui.all.css');
|
||||
|
||||
// clientside config
|
||||
// TODO Abstract this into FormField to make generic configuration interface
|
||||
$jsConfig = Convert::raw2json(array(
|
||||
'minDate' => $this->futureOnly ? SSDatetime::now()->format('m/d/Y') : null
|
||||
));
|
||||
|
||||
$this->addExtraClass($jsConfig);
|
||||
|
||||
return parent::Field();
|
||||
}
|
||||
|
||||
/**
|
||||
* Sets the field so that only future dates can be set on them
|
||||
* Sets the field so that only future dates can be set on them.
|
||||
* Only applies for JavaScript value, no server-side validation.
|
||||
*
|
||||
* @deprecated 2.4
|
||||
*/
|
||||
function futureDateOnly() {
|
||||
$this->futureOnly = true;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
?>
|
@ -11,14 +11,6 @@
|
||||
class DMYCalendarDateField extends CalendarDateField {
|
||||
|
||||
function Field() {
|
||||
Requirements::javascript(THIRDPARTY_DIR . "/calendar/calendar.js");
|
||||
Requirements::javascript(THIRDPARTY_DIR . "/calendar/lang/calendar-en.js");
|
||||
Requirements::javascript(THIRDPARTY_DIR . "/calendar/calendar-setup.js");
|
||||
Requirements::css(SAPPHIRE_DIR . "/css/CalendarDateField.css");
|
||||
Requirements::css(THIRDPARTY_DIR . "/calendar/calendar-win2k-1.css");
|
||||
Requirements::javascript(SAPPHIRE_DIR . "/javascript/NumericField.js");
|
||||
Requirements::javascript(SAPPHIRE_DIR . "/javascript/CalendarDateField.js");
|
||||
|
||||
$field = DateField::Field();
|
||||
|
||||
$id = $this->id();
|
||||
|
@ -0,0 +1,20 @@
|
||||
(function($) {
|
||||
/**
|
||||
* Formats a <input type="text"> field with a jQuery UI datepicker.
|
||||
*
|
||||
* Requires: concrete, ui.datepicker, jquery.metadata
|
||||
*
|
||||
* @author Ingo Schommer, SilverStripe Ltd.
|
||||
*/
|
||||
$('.calendardate').concrete('ss', {
|
||||
onmatch: function() {
|
||||
this.find('input').each(function() {
|
||||
var conf = $(this).metadata();
|
||||
if(conf.minDate) conf.minDate = new Date(Date.parse(conf.minDate));
|
||||
|
||||
//
|
||||
$(this).datepicker(conf);
|
||||
});
|
||||
}
|
||||
})
|
||||
}(jQuery));
|
Loading…
Reference in New Issue
Block a user