Задача очень простая сделать так что бы данный combobox заработал - но увы я что-то не учитаю. Пакет основывается на заготовке modxExtra
Xtype - у меня общий использую его в том числе для ввода поле в Window
Файл расположен infoBlock/assets/components/infoblock/js/mgr/misc/combo.js
// Combobox render Position
/******************************************************/
infoBlock.combo.Position = function (config) {
config = config || {};
Ext.applyIf(config, {
name: 'position_id',
fieldLabel: _('positions_' + config.name || 'positions'),
hiddenName: 'position_id',
displayField: 'name',
valueField: 'id',
anchor: '99%',
fields: ['name', 'id', 'alias'],
pageSize: 20,
url: infoBlock.config['connector_url'],
typeAhead: true,
editable: true,
allowBlank: false,
emptyText: _('no'),
minChars: 1,
baseParams: {
action: 'mgr/position/getlist',
combo: true,
id: config.value,
},
triggerConfig: {
tag: 'span',
cls: 'x-field-combo-btns',
cn: [
{tag: 'div', cls: 'x-form-trigger x-field-combo-list'},
{tag: 'div', cls: 'x-form-trigger x-field-combo-trigger-clear'}
]
},
onTriggerClick: function(event, btn) {
if (btn && Ext.get(btn).hasClass('x-field-combo-trigger-clear')) {
this.setValue(_('no'));
this.fireEvent('clear', this);
} else {
MODx.combo.ComboBox.superclass.onTriggerClick.call(this);
}
},
tpl: new Ext.XTemplate(''
+'<tpl for="."><div class="x-combo-list-item infoblock-position-list-item">'
+'<tpl if="alias"><small>{alias} /</small></br></tpl>'
+'<span><tpl if="id"><sup><small>({id})</small></sup> </tpl><b>{name}</b></span>'
+'</div></tpl>',
{
compiled: true
}),
itemSelector: 'div.infoblock-position-list-item'
});
infoBlock.combo.Position.superclass.constructor.call(this, config);
this.on('expand', function () {
if (!!this.pageTb) {
this.pageTb.show();
}
});
};
Далее отрезок кода расположенный infoBlock/assets/components/infoblock/js/mgr/widgets/items.grid.js
getTopBar: function () {
return [{
text: '<i class="icon icon-plus"></i> ' + _('infoblock_item_create'),
handler: this.createItem,
scope: this
}, {
xtype: 'infoblock-combo-position',
name: 'position',
width: 210,
custm: true,
clear: true,
addall: true,
value: '',
listeners: {
select: {
fn: this._filterByCombo,
scope: this
},
afterrender: {
fn: this._filterByCombo,
scope: this
},
clear: {
fn: function (field) {
field.clearValue('');
this._clearByCombo();
}, scope: this
}
}
}, '->', {
xtype: 'infoblock-field-search',
width: 250,
listeners: {
search: {
fn: function (field) {
this._doSearch(field);
}, scope: this
},
clear: {
fn: function (field) {
field.setValue('');
this._clearSearch();
}, scope: this
},
}
}];
},
Функции
_filterByCombo: function (cb) {
this.getStore().baseParams[cb.name] = cb.value;
this.getBottomToolbar().changePage(1);
},
_clearByCombo: function () {
this.getStore().baseParams.name = '';
this.getBottomToolbar().changePage(1);
},
_doSearch: function (tf) {
this.getStore().baseParams.query = tf.getValue();
this.getBottomToolbar().changePage(1);
},
_clearSearch: function () {
this.getStore().baseParams.query = '';
this.getBottomToolbar().changePage(1);
},