选择月份或年份时,ExtJS 5 xtype datefield不起作用

时间:2014-09-22 17:28:35

标签: extjs datefield

当点击下拉列表选择单个月/年时,对话框会消失,就像我试图点击一样。

小提琴:https://fiddle.sencha.com/#fiddle/9m6

   Ext.onReady(function() {
    Ext.create('Ext.form.Panel', {
        title: 'Simple Form',
        bodyPadding: 5,
        width: 350,
        // The fields
        defaultType: 'textfield',
        items: [{
            xtype: 'datefield',
            fieldLabel: 'Start Date',
            id: 'startDate'
        }],
        renderTo: Ext.getBody()
        });
    });

这已在ExtJs 5.1.0.107

中修复
  

EXTJS-15968点击月份选择器后日期选择器消失。

     

http://docs.sencha.com/extjs/5.1/whats_new/release_notes.html

1 个答案:

答案 0 :(得分:4)

在Ext.Js v 5.0.1中确实是一个错误。 http://www.sencha.com/forum/showthread.php?289825

重写Ext.picker.Date类的解决方案对我有用:

Ext.define('EXTJS-14607.picker.Date', {
    override: 'Ext.picker.Date',


    runAnimation: function(isHide) {
        var me = this,
            picker = this.monthPicker,
            options = {
                duration: 200,
                callback: function() {
                    picker.setVisible(!isHide);
                    // See showMonthPicker
                    picker.ownerCmp = isHide ? null : me;
                }
            };


        if (isHide) {
            picker.el.slideOut('t', options);
        } else {
            picker.el.slideIn('t', options);
        }
    },


    hideMonthPicker: function(animate) {
        var me = this,
            picker = me.monthPicker;


        if (picker && picker.isVisible()) {
            if (me.shouldAnimate(animate)) {
                me.runAnimation(true);
            } else {
                picker.hide();
                // See showMonthPicker
                picker.ownerCmp = null;
            }
        }
        return me;
    },


    showMonthPicker: function(animate) {
        var me = this,
            el = me.el,
            picker;


        if (me.rendered && !me.disabled) {
            picker = me.createMonthPicker();
            if (!picker.isVisible()) {
                picker.setValue(me.getActive());
                picker.setSize(el.getSize());
                picker.setPosition(-el.getBorderWidth('l'), -el.getBorderWidth('t'));
                if (me.shouldAnimate(animate)) {
                    me.runAnimation(false);
                } else {
                    picker.show();
                    // We need to set the ownerCmp so that owns() can correctly
                    // match up the component hierarchy, however when positioning the picker
                    // we don't want it to position like a normal floater because we render it to 
                    // month picker element itself.
                    picker.ownerCmp = me;
                }
            }
        }
        return me;
    }
});