Field of the month on EXTJS 5.1

Question

I got this awesome fiddle https://fiddle.sencha.com/#fiddle/h5i from another columnar overflow message (thanks igor). BUT I have one problem: the code does not work if I choose extjs version 5.1, which is the version that I use in my application. The problem is that when I click the month or year, the calendar just closes (you can try the behavior by installing version 5.1 and running the violin again). I tried setting up custom parts of the code, but nothing changed: s.

Anyone have any ideas why this does not work with extjs 5.1, or how can I solve this problem?

Thanks in advance:)!

Answer 1

Somehow the behavior of Chrome is different. Try the following:

createPicker: function () { var me = this, format = Ext.String.format, pickerConfig; pickerConfig = { pickerField: me, ownerCmp: me, renderTo: document.body, floating: true, hidden: true, focusOnShow: true, minDate: me.minValue, maxDate: me.maxValue, disabledDatesRE: me.disabledDatesRE, disabledDatesText: me.disabledDatesText, disabledDays: me.disabledDays, disabledDaysText: me.disabledDaysText, format: me.format, showToday: me.showToday, startDay: me.startDay, minText: format(me.minText, me.formatDate(me.minValue)), maxText: format(me.maxText, me.formatDate(me.maxValue)), listeners: { select: { scope: me, fn: me.onSelect }, monthdblclick: { scope: me, fn: me.onOKClick }, yeardblclick: { scope: me, fn: me.onOKClick }, OkClick: { scope: me, fn: me.onOKClick }, CancelClick: { scope: me, fn: me.onCancelClick } }, keyNavConfig: { esc: function () { me.collapse(); } } }; if (Ext.isChrome) { me.originalCollapse = me.collapse; pickerConfig.listeners.boxready = { fn: function () { this.picker.el.on({ mousedown: function () { this.collapse = Ext.emptyFn; }, mouseup: function () { this.collapse = this.originalCollapse; }, scope: this }); }, scope: me, single: true } } return Ext.create('Ext.picker.Month', pickerConfig); } 

Answer 2

Add properties:

 onFocusLeave: Ext.emptyFn