2012-04-20 63 views
3

我有一個ExtJS日期字段。在應用程序的某些操作過程中,最小值和最大值分配給日期字段。最小值和最大值是當前dat前4年,但當日期選擇器打開時,它將打開到禁用的當前日期。用戶必須手動向後滾動4年才能選擇日期。無論如何,我可以通過顯示最小值和最大值之間的日期更新日期選擇器打開?ExtJS DateField - 初始化日期

添加代碼:

cmpDt.setMinValue(new Date(2000, 0, 1)); 
cmpDt.setMaxValue(new Date(2004, 0, 1)); 

此設置最低和最高值。我無法使用setValue(),因爲它無效/更改了文本字段。我希望textfield只能從日期選擇器中獲取值。

感謝

回答

5

您可以選擇使用Ext.form.field.DateViewvalue屬性設置爲初始值:

{ 
    ..., 
    minValue: new Date(2000, 0, 1), 
    maxValue: new Date(2004, 11, 31), 
    value: new Date(2002, 5, 15), 
    ... 
} 

編輯後從OP的詳細信息:

,你可以覆蓋onExpand方法初始化選取器上的值。原來的樣子(假設你使用ExtJS的4 - 但3不應該是太大的不同):

..., 
onExpand: function() { 
    var value = this.getValue(); 
    this.picker.setValue(Ext.isDate(value) ? value : new Date()); 
}, 
... 

您可以覆蓋的方法如下:

..., 
onExpand: function() { 
    var value = this.getValue(), 
     myDefaultDate = /* do some processing to determine the default date*/; 
    this.picker.setValue(Ext.isDate(value) ? value : myDefaultDate); 
}, 
... 

倍率只需添加到初始表單字段配置。

+0

我不能將它添加到初始配置中,因爲最小值和最大值會在執行某些操作之間設置。 – Zaje 2012-04-20 07:26:41

+0

嗨, 執行上面的代碼後,我的選擇器沒有擴展或填充extjs 4。 – Kanchan 2013-07-08 06:49:40

0

對於任何對這個問題的EXTJS 3解決方案感興趣的人,我做了下面的代碼。

這允許您在聲明時將initialDateToShowOnPicker作爲配置傳遞給Ext.DatePicker,如果需要的話。

它還允許您在datepicker組件上調用setInitialDateToShowOnPicker(initialDateToShowOnPicker)來動態設置它。

兩者都需要使用Date()類型,並且datepicker上不能有已設置的值。

if (Ext.versionDetail && Ext.versionDetail.major == 3) { 

Ext.form.DateField.prototype.setInitialDateToShowOnPicker = function (initialDateToShowOnPicker) { 
    this.initialDateToShowOnPicker = initialDateToShowOnPicker; 
}; 

Ext.form.DateField.override({ 
    onTriggerClick: function() { 
     if(this.disabled){ 
      return; 
     } 
     if(this.menu == null){ 
      this.menu = new Ext.menu.DateMenu({ 
       hideOnClick: false, 
       focusOnSelect: false 
      }); 
     } 
     this.onFocus(); 
     Ext.apply(this.menu.picker, { 
      minDate : this.minValue, 
      maxDate : this.maxValue, 
      disabledDatesRE : this.disabledDatesRE, 
      disabledDatesText : this.disabledDatesText, 
      disabledDays : this.disabledDays, 
      disabledDaysText : this.disabledDaysText, 
      format : this.format, 
      showToday : this.showToday, 
      startDay: this.startDay, 
      minText : String.format(this.minText, this.formatDate(this.minValue)), 
      maxText : String.format(this.maxText, this.formatDate(this.maxValue)), 
      initialDateToShowOnPicker: this.initialDateToShowOnPicker // Date() type 
     }); 
     this.menu.picker.setValue(this.getValue() || this.initialDateToShowOnPicker || new Date()); 
     this.menu.show(this.el, "tl-bl?"); 
     this.menuEvents('on'); 
    } 
});  }