]> source.dussan.org Git - jquery-ui.git/commitdiff
Fixed 2038 Split out display date and date value formats
authorKeith Wood <kbwood.au@gmail.com>
Sat, 21 Jun 2008 23:51:34 +0000 (23:51 +0000)
committerKeith Wood <kbwood.au@gmail.com>
Sat, 21 Jun 2008 23:51:34 +0000 (23:51 +0000)
demos/functional/templates/ui.datepicker.html
ui/ui.datepicker.js

index cc763f2243e97bd99a5bf14f3de07200df315a67..9ffa69eb41a335b78b479a6d10f0d2604ebc5cbe 100644 (file)
                                ]
                        },
 
+                       {
+                               title: 'Alternate Field and Format',
+                               desc: 'Simultaneously update an alternate field using an alternate date format. ' +
+                                       'This could be used to display selected dates in one format, while submitting ' +
+                                       'the dates in another format from a hidden field. The alternate field is ' +
+                                       'displayed here to demonstrate the functionality.',
+                               html: '<input type="text" size="24" value="" id="alt1" readonly="readonly"/>\n' +
+                                       '<input type="text" size="24" value="" id="alt2" readonly="readonly"/>',
+                               destroy: '$("#alt1").datepicker("destroy"); $("#alt2").val("");',
+
+                               options: [
+                                       {       desc: 'Single date selection',  source: '$("#alt1").datepicker({altField: "#alt2", altFormat: "yy-mm-dd", showOn: "both", buttonImage: "templates/images/calendar.gif", buttonImageOnly: true});' },
+                                       {       desc: 'Range date selection',   source: '$("#alt1").datepicker({altField: "#alt2", altFormat: "yy-mm-dd", rangeSelect: true, numberOfMonths: 2, showOn: "both", buttonImage: "templates/images/calendar.gif", buttonImageOnly: true});' }
+                               ]
+                       },
+
                        {
                                title: 'Default Date',
                                desc: 'Control which date is shown if the datepicker is opened with no value. The default is today.',
index c04252da833a4aaed2aba093c411974701875235..ced98633bd6d25f5c2b5dbfe8ece8ab3d46ec233 100644 (file)
@@ -111,7 +111,9 @@ function Datepicker() {
                numberOfMonths: 1, // Number of months to show at a time
                stepMonths: 1, // Number of months to step back/forward
                rangeSelect: false, // Allows for selecting a date range on one date picker
-               rangeSeparator: ' - ' // Text between two dates in a range
+               rangeSeparator: ' - ', // Text between two dates in a range
+               altField: '', // Selector for an alternate field to store selected dates into
+               altFormat: '' // The date format to use for the alternate field
        };
        $.extend(this._defaults, this.regional['']);
        this._datepickerDiv = $('<div id="' + this._mainDivId + '"></div>');
@@ -691,10 +693,12 @@ $.extend(Datepicker.prototype, {
        _selectDate: function(id, dateStr) {
                var inst = this._getInst(id);
                dateStr = (dateStr != null ? dateStr : inst._formatDate());
-               if (inst._rangeStart)
-                       dateStr = inst._formatDate(inst._rangeStart) + inst._get('rangeSeparator') + dateStr;
+               if (inst._get('rangeSelect') && dateStr)
+                       dateStr = (inst._rangeStart ? inst._formatDate(inst._rangeStart) :
+                               dateStr) + inst._get('rangeSeparator') + dateStr;
                if (inst._input)
                        inst._input.val(dateStr);
+               this._updateAlternate(inst);
                var onSelect = inst._get('onSelect');
                if (onSelect)
                        onSelect.apply((inst._input ? inst._input[0] : null), [dateStr, inst]);  // trigger custom callback
@@ -710,6 +714,21 @@ $.extend(Datepicker.prototype, {
                        this._lastInput = null;
                }
        },
+       
+       /* Update any alternate field to synchronise with the main field. */
+       _updateAlternate: function(inst) {
+               var altField = inst._get('altField');
+               if (altField) { // update alternate field too
+                       var altFormat = inst._get('altFormat');
+                       var date = inst._getDate();
+                       dateStr = (isArray(date) ? (!date[0] && !date[1] ? '' :
+                               $.datepicker.formatDate(altFormat, date[0], inst._getFormatConfig()) +
+                               inst._get('rangeSeparator') + $.datepicker.formatDate(
+                               altFormat, date[1] || date[0], inst._getFormatConfig())) :
+                               $.datepicker.formatDate(altFormat, date, inst._getFormatConfig()));
+                       $(altField).each(function() { $(this).val(dateStr); });
+               }
+       },
 
        /* Set as beforeShowDay function to prevent selection of weekends.
           @param  date  Date - the date to customise
@@ -1457,6 +1476,12 @@ function extendRemove(target, props) {
        return target;
 };
 
+/* Determine whether an object is an array. */
+function isArray(a) {
+       return (a && (($.browser.safari && typeof a == 'object' && a.length) ||
+               (a.constructor && a.constructor.toString().match(/\Array\(\)/))));
+};
+
 /* Invoke the datepicker functionality.
    @param  options  String - a command, optionally followed by additional parameters or
                     Object - settings for attaching new datepicker functionality