git.roojs.org Git - roojs1/blob - ux/DateDisplay.js

   1
   2
   3
   4
   5 Roo.form.DateDisplay = function(config){
   6
   7     config.listener = config.listener  || {};
   8     var c = Roo.apply({}, config);
   9     delete c.listener;
  10     Roo.form.DateDisplay.superclass.constructor.call(this, config);
  11
  12
  13
  14     Roo.log(c);
  15
  16
  17     this.picker = new Roo.DatePicker( c );
  18
  19     this.addEvents({
  20         /**
  21              * @event select
  22              * Fires when a date is selected
  23              * @param {DatePicker} this
  24              * @param {Date} date The selected date
  25              */
  26         'select': true,
  27         /**
  28              * @event monthchange
  29              * Fires when the displayed month changes
  30              * @param {DatePicker} this
  31              * @param {Date} date The selected month
  32              */
  33         'monthchange': true
  34     });
  35
  36
  37     this.picker.on('select', this.onSelect, this);
  38
  39 };
  40
  41 Roo.extend(Roo.form.DateDisplay , Roo.form.TextField ,  {
  42
  43     inputType  : 'hidden',
  44
  45     onRender : function(ct, position)
  46     {
  47         Roo.form.TextField.superclass.onRender.call(this, ct, position);
  48
  49
  50         this.el.dom.value = this.value ? this.formatDate(this.value, 'Y-m-d') : '';
  51         // prevent input submission
  52
  53         // now render the field..
  54         this.wrap = this.el.wrap();
  55
  56         this.viewEl = this.wrap.createChild({ tag: 'div', cls: 'x-form-displayfield'});
  57
  58         this.picker.onRender(this.viewEl, position);
  59
  60     },
  61     onSelect : function(sel) {
  62
  63         if (this.picker.value) {
  64             this.setValue(this.picker.value.format('Y-m-d'));
  65             this.fireEvent('select', this);
  66         }
  67
  68     }
  69
  70 });