ExtJS DateField - 初始化日期

时间:2012-04-20 06:56:36

标签: extjs datepicker datefield

我有一个ExtJS Date字段。在应用程序的某些操作期间,最小值和最大值将分配给日期字段。最小值和最大值是当前数据之前4年,但是当日期选择器打开时,它将打开到禁用的当前日期。用户必须手动回滚4年才能选择日期。无论如何,我可以通过显示最小值和最大值之间的日期来更新日期选择器以打开吗?

添加代码:

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

设置最小值和最大值。我无法使用setValue(),因为它会对文本字段进行初始化/更改。我希望textfield只能从datepicker中选择值。

由于

2 个答案:

答案 0 :(得分:5)

您必须使用value的{​​{1}}属性设置初始值:

Ext.form.field.DateView
在OP的更多信息后

编辑

您可以覆盖初始化选择器上的值的{ ..., minValue: new Date(2000, 0, 1), maxValue: new Date(2004, 11, 31), value: new Date(2002, 5, 15), ... } 方法。原始的看起来像(假设您使用ExtJS 4 - 但3应该不会那么大):

onExpand

您可以覆盖方法:

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

只需将覆盖添加到初始表单字段配置中。

答案 1 :(得分: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');
    }
});     }