Я хотел бы, чтобы выбор даты без дня или месяца, только с года.Extjs 5 - Только для выбора даты года
Я хотел бы это
EXTJS 5 - Date picker year and month only
, но без месяца, только год.
Благодаря
Я хотел бы, чтобы выбор даты без дня или месяца, только с года.Extjs 5 - Только для выбора даты года
Я хотел бы это
EXTJS 5 - Date picker year and month only
, но без месяца, только год.
Благодаря
Вы можете изменить сборщик скрыть месяц часть, и использовать этот класс для сборщика в поле даты. Я не делаю «дисплей: нет» на месяц секции (к логике prvent изменение компонента) и переопределить стиль для тела Picker (это лучше сделать в правилах CSS):
Ext.define('Ext.ux.OnlyYearPicker', {
xtype: 'onlyyearpicker',
extend: 'Ext.picker.Month',
afterRender: function(){
this.callParent();
this.el.setStyle({width: '106px',})
},
renderTpl: [
'<div id="{id}-bodyEl" data-ref="bodyEl" class="{baseCls}-body">',
'<div style="display: none; width:0px;" id="{id}-monthEl" data-ref="monthEl" class="{baseCls}-months">',
'<tpl for="months">',
'<div class="{parent.baseCls}-item {parent.baseCls}-month">',
'<a style="{parent.monthStyle}" role="button" hidefocus="on" class="{parent.baseCls}-item-inner">{.}</a>',
'</div>',
'</tpl>',
'</div>',
'<div id="{id}-yearEl" data-ref="yearEl" class="{baseCls}-years">',
'<div class="{baseCls}-yearnav">',
'<div class="{baseCls}-yearnav-button-ct">',
'<a id="{id}-prevEl" data-ref="prevEl" class="{baseCls}-yearnav-button {baseCls}-yearnav-prev" hidefocus="on" role="button"></a>',
'</div>',
'<div class="{baseCls}-yearnav-button-ct">',
'<a id="{id}-nextEl" data-ref="nextEl" class="{baseCls}-yearnav-button {baseCls}-yearnav-next" hidefocus="on" role="button"></a>',
'</div>',
'</div>',
'<tpl for="years">',
'<div class="{parent.baseCls}-item {parent.baseCls}-year">',
'<a hidefocus="on" class="{parent.baseCls}-item-inner" role="button">{.}</a>',
'</div>',
'</tpl>',
'</div>',
'<div class="' + Ext.baseCSSPrefix + 'clear"></div>',
'<tpl if="showButtons">',
'<div class="{baseCls}-buttons">{%',
'var me=values.$comp, okBtn=me.okBtn, cancelBtn=me.cancelBtn;',
'okBtn.ownerLayout = cancelBtn.ownerLayout = me.componentLayout;',
'okBtn.ownerCt = cancelBtn.ownerCt = me;',
'Ext.DomHelper.generateMarkup(okBtn.getRenderTree(), out);',
'Ext.DomHelper.generateMarkup(cancelBtn.getRenderTree(), out);',
'%}</div>',
'</tpl>',
'</div>'
]
});
Подробнее вы найдете в стельку. Выглядит уродливо, но работа. Я думаю, что вам лучше использовать что-то вроде combobox. В случае использования DatePicker пользовательский опыт выбора с кнопкой Ok для одного значения очень странный.
Для тех, кто имеет проблемы с Chrome, функция преобразования createPicker в этом:
createPicker: function() { // Converted function to Chrome
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.ux.OnlyYearPicker', pickerConfig);
},
Вы можете увидеть пример здесь: https://fiddle.sencha.com/#fiddle/1lmp
Без, ваша сборщика исчезнет на каждом щелкните по выбору года.
Большое спасибо! – Steefler35