3 * Copyright(c) 2006-2009 Ext JS, LLC
5 * http://www.extjs.com/license
8 * @class Ext.DatePicker
\r
9 * @extends Ext.Component
\r
10 * Simple date picker class.
\r
12 * Create a new DatePicker
\r
13 * @param {Object} config The config object
\r
16 Ext.DatePicker = Ext.extend(Ext.BoxComponent, {
\r
18 * @cfg {String} todayText
\r
19 * The text to display on the button that selects the current date (defaults to <tt>'Today'</tt>)
\r
21 todayText : 'Today',
\r
23 * @cfg {String} okText
\r
24 * The text to display on the ok button (defaults to <tt>' OK '</tt> to give the user extra clicking room)
\r
26 okText : ' OK ',
\r
28 * @cfg {String} cancelText
\r
29 * The text to display on the cancel button (defaults to <tt>'Cancel'</tt>)
\r
31 cancelText : 'Cancel',
\r
33 * @cfg {Function} handler
\r
34 * Optional. A function that will handle the select event of this picker.
\r
35 * The handler is passed the following parameters:<div class="mdetail-params"><ul>
\r
36 * <li><code>picker</code> : DatePicker<div class="sub-desc">The Ext.DatePicker.</div></li>
\r
37 * <li><code>date</code> : Date<div class="sub-desc">The selected date.</div></li>
\r
41 * @cfg {Object} scope
\r
42 * The scope (<tt><b>this</b></tt> reference) in which the <code>{@link #handler}</code>
\r
43 * function will be called. Defaults to this DatePicker instance.
\r
46 * @cfg {String} todayTip
\r
47 * The tooltip to display for the button that selects the current date (defaults to <tt>'{current date} (Spacebar)'</tt>)
\r
49 todayTip : '{0} (Spacebar)',
\r
51 * @cfg {String} minText
\r
52 * The error text to display if the minDate validation fails (defaults to <tt>'This date is before the minimum date'</tt>)
\r
54 minText : 'This date is before the minimum date',
\r
56 * @cfg {String} maxText
\r
57 * The error text to display if the maxDate validation fails (defaults to <tt>'This date is after the maximum date'</tt>)
\r
59 maxText : 'This date is after the maximum date',
\r
61 * @cfg {String} format
\r
62 * The default date format string which can be overriden for localization support. The format must be
\r
63 * valid according to {@link Date#parseDate} (defaults to <tt>'m/d/y'</tt>).
\r
67 * @cfg {String} disabledDaysText
\r
68 * The tooltip to display when the date falls on a disabled day (defaults to <tt>'Disabled'</tt>)
\r
70 disabledDaysText : 'Disabled',
\r
72 * @cfg {String} disabledDatesText
\r
73 * The tooltip text to display when the date falls on a disabled date (defaults to <tt>'Disabled'</tt>)
\r
75 disabledDatesText : 'Disabled',
\r
77 * @cfg {Array} monthNames
\r
78 * An array of textual month names which can be overriden for localization support (defaults to Date.monthNames)
\r
80 monthNames : Date.monthNames,
\r
82 * @cfg {Array} dayNames
\r
83 * An array of textual day names which can be overriden for localization support (defaults to Date.dayNames)
\r
85 dayNames : Date.dayNames,
\r
87 * @cfg {String} nextText
\r
88 * The next month navigation button tooltip (defaults to <tt>'Next Month (Control+Right)'</tt>)
\r
90 nextText : 'Next Month (Control+Right)',
\r
92 * @cfg {String} prevText
\r
93 * The previous month navigation button tooltip (defaults to <tt>'Previous Month (Control+Left)'</tt>)
\r
95 prevText : 'Previous Month (Control+Left)',
\r
97 * @cfg {String} monthYearText
\r
98 * The header month selector tooltip (defaults to <tt>'Choose a month (Control+Up/Down to move years)'</tt>)
\r
100 monthYearText : 'Choose a month (Control+Up/Down to move years)',
\r
102 * @cfg {Number} startDay
\r
103 * Day index at which the week should begin, 0-based (defaults to 0, which is Sunday)
\r
107 * @cfg {Boolean} showToday
\r
108 * False to hide the footer area containing the Today button and disable the keyboard handler for spacebar
\r
109 * that selects the current date (defaults to <tt>true</tt>).
\r
113 * @cfg {Date} minDate
\r
114 * Minimum allowable date (JavaScript date object, defaults to null)
\r
117 * @cfg {Date} maxDate
\r
118 * Maximum allowable date (JavaScript date object, defaults to null)
\r
121 * @cfg {Array} disabledDays
\r
122 * An array of days to disable, 0-based. For example, [0, 6] disables Sunday and Saturday (defaults to null).
\r
125 * @cfg {RegExp} disabledDatesRE
\r
126 * JavaScript regular expression used to disable a pattern of dates (defaults to null). The {@link #disabledDates}
\r
127 * config will generate this regex internally, but if you specify disabledDatesRE it will take precedence over the
\r
128 * disabledDates value.
\r
131 * @cfg {Array} disabledDates
\r
132 * An array of 'dates' to disable, as strings. These strings will be used to build a dynamic regular
\r
133 * expression so they are very powerful. Some examples:
\r
135 * <li>['03/08/2003', '09/16/2003'] would disable those exact dates</li>
\r
136 * <li>['03/08', '09/16'] would disable those days for every year</li>
\r
137 * <li>['^03/08'] would only match the beginning (useful if you are using short years)</li>
\r
138 * <li>['03/../2006'] would disable every day in March 2006</li>
\r
139 * <li>['^03'] would disable every day in every March</li>
\r
141 * Note that the format of the dates included in the array should exactly match the {@link #format} config.
\r
142 * In order to support regular expressions, if you are using a date format that has '.' in it, you will have to
\r
143 * escape the dot when restricting dates. For example: ['03\\.08\\.03'].
\r
147 initComponent : function(){
\r
148 Ext.DatePicker.superclass.initComponent.call(this);
\r
150 this.value = this.value ?
\r
151 this.value.clearTime(true) : new Date().clearTime();
\r
156 * Fires when a date is selected
\r
157 * @param {DatePicker} this
\r
158 * @param {Date} date The selected date
\r
164 this.on('select', this.handler, this.scope || this);
\r
167 this.initDisabledDays();
\r
171 initDisabledDays : function(){
\r
172 if(!this.disabledDatesRE && this.disabledDates){
\r
173 var dd = this.disabledDates,
\r
174 len = dd.length - 1,
\r
177 Ext.each(dd, function(d, i){
\r
178 re += Ext.isDate(d) ? '^' + Ext.escapeRe(d.dateFormat(this.format)) + '$' : dd[i];
\r
183 this.disabledDatesRE = new RegExp(re + ')');
\r
188 * Replaces any existing disabled dates with new values and refreshes the DatePicker.
\r
189 * @param {Array/RegExp} disabledDates An array of date strings (see the {@link #disabledDates} config
\r
190 * for details on supported values), or a JavaScript regular expression used to disable a pattern of dates.
\r
192 setDisabledDates : function(dd){
\r
193 if(Ext.isArray(dd)){
\r
194 this.disabledDates = dd;
\r
195 this.disabledDatesRE = null;
\r
197 this.disabledDatesRE = dd;
\r
199 this.initDisabledDays();
\r
200 this.update(this.value, true);
\r
204 * Replaces any existing disabled days (by index, 0-6) with new values and refreshes the DatePicker.
\r
205 * @param {Array} disabledDays An array of disabled day indexes. See the {@link #disabledDays} config
\r
206 * for details on supported values.
\r
208 setDisabledDays : function(dd){
\r
209 this.disabledDays = dd;
\r
210 this.update(this.value, true);
\r
214 * Replaces any existing {@link #minDate} with the new value and refreshes the DatePicker.
\r
215 * @param {Date} value The minimum date that can be selected
\r
217 setMinDate : function(dt){
\r
219 this.update(this.value, true);
\r
223 * Replaces any existing {@link #maxDate} with the new value and refreshes the DatePicker.
\r
224 * @param {Date} value The maximum date that can be selected
\r
226 setMaxDate : function(dt){
\r
228 this.update(this.value, true);
\r
232 * Sets the value of the date field
\r
233 * @param {Date} value The date to set
\r
235 setValue : function(value){
\r
236 this.value = value.clearTime(true);
\r
237 this.update(this.value);
\r
241 * Gets the current selected value of the date field
\r
242 * @return {Date} The selected date
\r
244 getValue : function(){
\r
249 focus : function(){
\r
250 this.update(this.activeDate);
\r
254 onEnable: function(initial){
\r
255 Ext.DatePicker.superclass.onEnable.call(this);
\r
256 this.doDisabled(false);
\r
257 this.update(initial ? this.value : this.activeDate);
\r
265 onDisable : function(){
\r
266 Ext.DatePicker.superclass.onDisable.call(this);
\r
267 this.doDisabled(true);
\r
268 if(Ext.isIE && !Ext.isIE8){
\r
269 /* Really strange problem in IE6/7, when disabled, have to explicitly
\r
270 * repaint each of the nodes to get them to display correctly, simply
\r
271 * calling repaint on the main element doesn't appear to be enough.
\r
273 Ext.each([].concat(this.textNodes, this.el.query('th span')), function(el){
\r
274 Ext.fly(el).repaint();
\r
280 doDisabled : function(disabled){
\r
281 this.keyNav.setDisabled(disabled);
\r
282 this.prevRepeater.setDisabled(disabled);
\r
283 this.nextRepeater.setDisabled(disabled);
\r
284 if(this.showToday){
\r
285 this.todayKeyListener.setDisabled(disabled);
\r
286 this.todayBtn.setDisabled(disabled);
\r
291 onRender : function(container, position){
\r
293 '<table cellspacing="0">',
\r
294 '<tr><td class="x-date-left"><a href="#" title="', this.prevText ,'"> </a></td><td class="x-date-middle" align="center"></td><td class="x-date-right"><a href="#" title="', this.nextText ,'"> </a></td></tr>',
\r
295 '<tr><td colspan="3"><table class="x-date-inner" cellspacing="0"><thead><tr>'],
\r
296 dn = this.dayNames,
\r
298 for(i = 0; i < 7; i++){
\r
299 var d = this.startDay+i;
\r
303 m.push('<th><span>', dn[d].substr(0,1), '</span></th>');
\r
305 m[m.length] = '</tr></thead><tbody><tr>';
\r
306 for(i = 0; i < 42; i++) {
\r
307 if(i % 7 === 0 && i !== 0){
\r
308 m[m.length] = '</tr><tr>';
\r
310 m[m.length] = '<td><a href="#" hidefocus="on" class="x-date-date" tabIndex="1"><em><span></span></em></a></td>';
\r
312 m.push('</tr></tbody></table></td></tr>',
\r
313 this.showToday ? '<tr><td colspan="3" class="x-date-bottom" align="center"></td></tr>' : '',
\r
314 '</table><div class="x-date-mp"></div>');
\r
316 var el = document.createElement('div');
\r
317 el.className = 'x-date-picker';
\r
318 el.innerHTML = m.join('');
\r
320 container.dom.insertBefore(el, position);
\r
322 this.el = Ext.get(el);
\r
323 this.eventEl = Ext.get(el.firstChild);
\r
325 this.prevRepeater = new Ext.util.ClickRepeater(this.el.child('td.x-date-left a'), {
\r
326 handler: this.showPrevMonth,
\r
328 preventDefault:true,
\r
332 this.nextRepeater = new Ext.util.ClickRepeater(this.el.child('td.x-date-right a'), {
\r
333 handler: this.showNextMonth,
\r
335 preventDefault:true,
\r
339 this.monthPicker = this.el.down('div.x-date-mp');
\r
340 this.monthPicker.enableDisplayMode('block');
\r
342 this.keyNav = new Ext.KeyNav(this.eventEl, {
\r
343 'left' : function(e){
\r
345 this.showPrevMonth();
\r
347 this.update(this.activeDate.add('d', -1));
\r
351 'right' : function(e){
\r
353 this.showNextMonth();
\r
355 this.update(this.activeDate.add('d', 1));
\r
359 'up' : function(e){
\r
361 this.showNextYear();
\r
363 this.update(this.activeDate.add('d', -7));
\r
367 'down' : function(e){
\r
369 this.showPrevYear();
\r
371 this.update(this.activeDate.add('d', 7));
\r
375 'pageUp' : function(e){
\r
376 this.showNextMonth();
\r
379 'pageDown' : function(e){
\r
380 this.showPrevMonth();
\r
383 'enter' : function(e){
\r
384 e.stopPropagation();
\r
391 this.el.unselectable();
\r
393 this.cells = this.el.select('table.x-date-inner tbody td');
\r
394 this.textNodes = this.el.query('table.x-date-inner tbody span');
\r
396 this.mbtn = new Ext.Button({
\r
398 tooltip: this.monthYearText,
\r
399 renderTo: this.el.child('td.x-date-middle', true)
\r
401 this.mbtn.el.child('em').addClass('x-btn-arrow');
\r
403 if(this.showToday){
\r
404 this.todayKeyListener = this.eventEl.addKeyListener(Ext.EventObject.SPACE, this.selectToday, this);
\r
405 var today = (new Date()).dateFormat(this.format);
\r
406 this.todayBtn = new Ext.Button({
\r
407 renderTo: this.el.child('td.x-date-bottom', true),
\r
408 text: String.format(this.todayText, today),
\r
409 tooltip: String.format(this.todayTip, today),
\r
410 handler: this.selectToday,
\r
414 this.mon(this.eventEl, 'mousewheel', this.handleMouseWheel, this);
\r
415 this.mon(this.eventEl, 'click', this.handleDateClick, this, {delegate: 'a.x-date-date'});
\r
416 this.mon(this.mbtn, 'click', this.showMonthPicker, this);
\r
417 this.onEnable(true);
\r
421 createMonthPicker : function(){
\r
422 if(!this.monthPicker.dom.firstChild){
\r
423 var buf = ['<table border="0" cellspacing="0">'];
\r
424 for(var i = 0; i < 6; i++){
\r
426 '<tr><td class="x-date-mp-month"><a href="#">', Date.getShortMonthName(i), '</a></td>',
\r
427 '<td class="x-date-mp-month x-date-mp-sep"><a href="#">', Date.getShortMonthName(i + 6), '</a></td>',
\r
429 '<td class="x-date-mp-ybtn" align="center"><a class="x-date-mp-prev"></a></td><td class="x-date-mp-ybtn" align="center"><a class="x-date-mp-next"></a></td></tr>' :
\r
430 '<td class="x-date-mp-year"><a href="#"></a></td><td class="x-date-mp-year"><a href="#"></a></td></tr>'
\r
434 '<tr class="x-date-mp-btns"><td colspan="4"><button type="button" class="x-date-mp-ok">',
\r
436 '</button><button type="button" class="x-date-mp-cancel">',
\r
438 '</button></td></tr>',
\r
441 this.monthPicker.update(buf.join(''));
\r
443 this.mon(this.monthPicker, 'click', this.onMonthClick, this);
\r
444 this.mon(this.monthPicker, 'dblclick', this.onMonthDblClick, this);
\r
446 this.mpMonths = this.monthPicker.select('td.x-date-mp-month');
\r
447 this.mpYears = this.monthPicker.select('td.x-date-mp-year');
\r
449 this.mpMonths.each(function(m, a, i){
\r
452 m.dom.xmonth = 5 + Math.round(i * 0.5);
\r
454 m.dom.xmonth = Math.round((i-1) * 0.5);
\r
461 showMonthPicker : function(){
\r
462 if(!this.disabled){
\r
463 this.createMonthPicker();
\r
464 var size = this.el.getSize();
\r
465 this.monthPicker.setSize(size);
\r
466 this.monthPicker.child('table').setSize(size);
\r
468 this.mpSelMonth = (this.activeDate || this.value).getMonth();
\r
469 this.updateMPMonth(this.mpSelMonth);
\r
470 this.mpSelYear = (this.activeDate || this.value).getFullYear();
\r
471 this.updateMPYear(this.mpSelYear);
\r
473 this.monthPicker.slideIn('t', {duration:0.2});
\r
478 updateMPYear : function(y){
\r
480 var ys = this.mpYears.elements;
\r
481 for(var i = 1; i <= 10; i++){
\r
482 var td = ys[i-1], y2;
\r
484 y2 = y + Math.round(i * 0.5);
\r
485 td.firstChild.innerHTML = y2;
\r
488 y2 = y - (5-Math.round(i * 0.5));
\r
489 td.firstChild.innerHTML = y2;
\r
492 this.mpYears.item(i-1)[y2 == this.mpSelYear ? 'addClass' : 'removeClass']('x-date-mp-sel');
\r
497 updateMPMonth : function(sm){
\r
498 this.mpMonths.each(function(m, a, i){
\r
499 m[m.dom.xmonth == sm ? 'addClass' : 'removeClass']('x-date-mp-sel');
\r
504 selectMPMonth : function(m){
\r
509 onMonthClick : function(e, t){
\r
511 var el = new Ext.Element(t), pn;
\r
512 if(el.is('button.x-date-mp-cancel')){
\r
513 this.hideMonthPicker();
\r
515 else if(el.is('button.x-date-mp-ok')){
\r
516 var d = new Date(this.mpSelYear, this.mpSelMonth, (this.activeDate || this.value).getDate());
\r
517 if(d.getMonth() != this.mpSelMonth){
\r
518 // 'fix' the JS rolling date conversion if needed
\r
519 d = new Date(this.mpSelYear, this.mpSelMonth, 1).getLastDateOfMonth();
\r
522 this.hideMonthPicker();
\r
524 else if((pn = el.up('td.x-date-mp-month', 2))){
\r
525 this.mpMonths.removeClass('x-date-mp-sel');
\r
526 pn.addClass('x-date-mp-sel');
\r
527 this.mpSelMonth = pn.dom.xmonth;
\r
529 else if((pn = el.up('td.x-date-mp-year', 2))){
\r
530 this.mpYears.removeClass('x-date-mp-sel');
\r
531 pn.addClass('x-date-mp-sel');
\r
532 this.mpSelYear = pn.dom.xyear;
\r
534 else if(el.is('a.x-date-mp-prev')){
\r
535 this.updateMPYear(this.mpyear-10);
\r
537 else if(el.is('a.x-date-mp-next')){
\r
538 this.updateMPYear(this.mpyear+10);
\r
543 onMonthDblClick : function(e, t){
\r
545 var el = new Ext.Element(t), pn;
\r
546 if((pn = el.up('td.x-date-mp-month', 2))){
\r
547 this.update(new Date(this.mpSelYear, pn.dom.xmonth, (this.activeDate || this.value).getDate()));
\r
548 this.hideMonthPicker();
\r
550 else if((pn = el.up('td.x-date-mp-year', 2))){
\r
551 this.update(new Date(pn.dom.xyear, this.mpSelMonth, (this.activeDate || this.value).getDate()));
\r
552 this.hideMonthPicker();
\r
557 hideMonthPicker : function(disableAnim){
\r
558 if(this.monthPicker){
\r
559 if(disableAnim === true){
\r
560 this.monthPicker.hide();
\r
562 this.monthPicker.slideOut('t', {duration:0.2});
\r
568 showPrevMonth : function(e){
\r
569 this.update(this.activeDate.add('mo', -1));
\r
573 showNextMonth : function(e){
\r
574 this.update(this.activeDate.add('mo', 1));
\r
578 showPrevYear : function(){
\r
579 this.update(this.activeDate.add('y', -1));
\r
583 showNextYear : function(){
\r
584 this.update(this.activeDate.add('y', 1));
\r
588 handleMouseWheel : function(e){
\r
590 if(!this.disabled){
\r
591 var delta = e.getWheelDelta();
\r
593 this.showPrevMonth();
\r
594 } else if(delta < 0){
\r
595 this.showNextMonth();
\r
601 handleDateClick : function(e, t){
\r
603 if(!this.disabled && t.dateValue && !Ext.fly(t.parentNode).hasClass('x-date-disabled')){
\r
604 this.setValue(new Date(t.dateValue));
\r
605 this.fireEvent('select', this, this.value);
\r
610 selectToday : function(){
\r
611 if(this.todayBtn && !this.todayBtn.disabled){
\r
612 this.setValue(new Date().clearTime());
\r
613 this.fireEvent('select', this, this.value);
\r
618 update : function(date, forceRefresh){
\r
620 var vd = this.activeDate, vis = this.isVisible();
\r
621 this.activeDate = date;
\r
622 if(!forceRefresh && vd && this.el){
\r
623 var t = date.getTime();
\r
624 if(vd.getMonth() == date.getMonth() && vd.getFullYear() == date.getFullYear()){
\r
625 this.cells.removeClass('x-date-selected');
\r
626 this.cells.each(function(c){
\r
627 if(c.dom.firstChild.dateValue == t){
\r
628 c.addClass('x-date-selected');
\r
630 Ext.fly(c.dom.firstChild).focus(50);
\r
638 var days = date.getDaysInMonth(),
\r
639 firstOfMonth = date.getFirstDateOfMonth(),
\r
640 startingPos = firstOfMonth.getDay()-this.startDay;
\r
642 if(startingPos < 0){
\r
645 days += startingPos;
\r
647 var pm = date.add('mo', -1),
\r
648 prevStart = pm.getDaysInMonth()-startingPos,
\r
649 cells = this.cells.elements,
\r
650 textEls = this.textNodes,
\r
651 // convert everything to numbers so it's fast
\r
653 d = (new Date(pm.getFullYear(), pm.getMonth(), prevStart)).clearTime(),
\r
654 today = new Date().clearTime().getTime(),
\r
655 sel = date.clearTime(true).getTime(),
\r
656 min = this.minDate ? this.minDate.clearTime(true) : Number.NEGATIVE_INFINITY,
\r
657 max = this.maxDate ? this.maxDate.clearTime(true) : Number.POSITIVE_INFINITY,
\r
658 ddMatch = this.disabledDatesRE,
\r
659 ddText = this.disabledDatesText,
\r
660 ddays = this.disabledDays ? this.disabledDays.join('') : false,
\r
661 ddaysText = this.disabledDaysText,
\r
662 format = this.format;
\r
664 if(this.showToday){
\r
665 var td = new Date().clearTime(),
\r
666 disable = (td < min || td > max ||
\r
667 (ddMatch && format && ddMatch.test(td.dateFormat(format))) ||
\r
668 (ddays && ddays.indexOf(td.getDay()) != -1));
\r
670 if(!this.disabled){
\r
671 this.todayBtn.setDisabled(disable);
\r
672 this.todayKeyListener[disable ? 'disable' : 'enable']();
\r
676 var setCellClass = function(cal, cell){
\r
678 var t = d.getTime();
\r
679 cell.firstChild.dateValue = t;
\r
681 cell.className += ' x-date-today';
\r
682 cell.title = cal.todayText;
\r
685 cell.className += ' x-date-selected';
\r
687 Ext.fly(cell.firstChild).focus(50);
\r
692 cell.className = ' x-date-disabled';
\r
693 cell.title = cal.minText;
\r
697 cell.className = ' x-date-disabled';
\r
698 cell.title = cal.maxText;
\r
702 if(ddays.indexOf(d.getDay()) != -1){
\r
703 cell.title = ddaysText;
\r
704 cell.className = ' x-date-disabled';
\r
707 if(ddMatch && format){
\r
708 var fvalue = d.dateFormat(format);
\r
709 if(ddMatch.test(fvalue)){
\r
710 cell.title = ddText.replace('%0', fvalue);
\r
711 cell.className = ' x-date-disabled';
\r
717 for(; i < startingPos; i++) {
\r
718 textEls[i].innerHTML = (++prevStart);
\r
719 d.setDate(d.getDate()+1);
\r
720 cells[i].className = 'x-date-prevday';
\r
721 setCellClass(this, cells[i]);
\r
723 for(; i < days; i++){
\r
724 var intDay = i - startingPos + 1;
\r
725 textEls[i].innerHTML = (intDay);
\r
726 d.setDate(d.getDate()+1);
\r
727 cells[i].className = 'x-date-active';
\r
728 setCellClass(this, cells[i]);
\r
731 for(; i < 42; i++) {
\r
732 textEls[i].innerHTML = (++extraDays);
\r
733 d.setDate(d.getDate()+1);
\r
734 cells[i].className = 'x-date-nextday';
\r
735 setCellClass(this, cells[i]);
\r
738 this.mbtn.setText(this.monthNames[date.getMonth()] + ' ' + date.getFullYear());
\r
740 if(!this.internalRender){
\r
741 var main = this.el.dom.firstChild,
\r
742 w = main.offsetWidth;
\r
743 this.el.setWidth(w + this.el.getBorderWidth('lr'));
\r
744 Ext.fly(main).setWidth(w);
\r
745 this.internalRender = true;
\r
746 // opera does not respect the auto grow header center column
\r
747 // then, after it gets a width opera refuses to recalculate
\r
748 // without a second pass
\r
749 if(Ext.isOpera && !this.secondPass){
\r
750 main.rows[0].cells[1].style.width = (w - (main.rows[0].cells[0].offsetWidth+main.rows[0].cells[2].offsetWidth)) + 'px';
\r
751 this.secondPass = true;
\r
752 this.update.defer(10, this, [date]);
\r
759 beforeDestroy : function() {
\r
761 this.keyNav.disable();
\r
762 this.keyNav = null;
\r
765 this.rightClickRpt,
\r
775 * @cfg {String} autoEl @hide
\r
779 Ext.reg('datepicker', Ext.DatePicker);
\r