extjs 月份选择控件_EXTJS 5 - 日期选择器仅限年份和月份

I guess this question has been asked a lot (as I found a few topics about it), but I still don't really know how to render a date picker, by only displaying month and year.

I think I can do this differently:

Create my own cuctom component (but I think my knowledge of Extjs is not good enough to be able to create a component which displays the month and year, and, when clicked, renders a year and month picker.

Use some code found on google which creates a plugin (but I dont know how to use plugins in extjs ^^").

Use a third library year and month picker to add in my extjs application.

Could you guys please guide me through what I should select, and give me any links I can refer to ?

Thanks in advance !

解决方案

Sencha don't have this component, but something like this we are get it

Ext.define('Ext.form.field.Month', {

extend: 'Ext.form.field.Date',

alias: 'widget.monthfield',

requires: ['Ext.picker.Month'],

alternateClassName: ['Ext.form.MonthField', 'Ext.form.Month'],

selectMonth: null,

createPicker: function() {

var me = this,

format = Ext.String.format;

return Ext.create('Ext.picker.Month', {

pickerField: me,

ownerCt: me.ownerCt,

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();

}

}

});

},

onCancelClick: function() {

var me = this;

me.selectMonth = null;

me.collapse();

},

onOKClick: function() {

var me = this;

if (me.selectMonth) {

me.setValue(me.selectMonth);

me.fireEvent('select', me, me.selectMonth);

}

me.collapse();

},

onSelect: function(m, d) {

var me = this;

me.selectMonth = new Date((d[0] + 1) + '/1/' + d[1]);

}

});

...

Ext.create('Ext.form.field.Month', {

format: 'F, Y',

renderTo: Ext.getBody()

});