Вопрос по ExtJS: обращение к элементам?
Здравствуйте
Если кратко — есть панель, она содержит в себе четыре колонки в каждой из которых по одному элементу — всего три комбобокса. Допустим при событии select у первого комбобокса необходимо что-то сделать со вторым (как пример hide). Вопрос про обработчик событий и тп. меня не волнует, я хочу понять — как правильно обращаться к элементам, которые по сути в одном объекте?
Самый простой способ обратиться ко второму комбобокус — получить его по id: Ext.getCmp('temp-combo-second').hide(); Но что-то мне подсказывает, что подобный способ далеко не самый оптимальный, ведь все комбобоксы находятся в одной панеле. Как правильнее/грамотно получить этот элемент, чтобы не нарушать принципы ООП?
Спасибо за внимание
Задачу в которой столкнулся с заданным выше вопросом — решил, но не хочу превращаться в быдлоExtJSкодера =/
Для пример набросал псевдокод:
Temp.panel.Panel = function(config) {
config = config || {};
Ext.applyIf(config,{
id: 'temp-panel-id'
,url: Temp.config.connectorUrl
,layout: 'column'
,items: [{
layout: 'form'
,items: [{
xtype: 'modx-combo'
,id: 'temp-combo-first'
//...
}]
},{
layout: 'form'
,items: [{
xtype: 'modx-combo'
,id: 'temp-combo-second'
//...
}]
},{
layout: 'form'
,items: [{
xtype: 'modx-combo'
,id: 'temp-combo-third'
//...
}]
}]
});
Temp.panel.Panel.superclass.constructor.call(this,config)
};
Ext.extend(Temp.panel.Panel,MODx.Panel);
Комментарии: 5
По идее, они все вместе находятся в this и ты можешь сделать
Будет что-то типа
Но не уверен, я в ExtJS новичок.
console.log(this)
чтобы увидеть его. В консоли хрома можно будет погулять по этому объекту и найти те элементы, к которым ты хочешь обратиться.Будет что-то типа
obj = this.items.elements[1];
obj.hide();
Но не уверен, я в ExtJS новичок.
Василий, спасибо за ответ
К сожалению такой вариант не подходит, так как копание «руками» в объектах ExtJS гиблое дело, абсолютно бесполезное. В них столько всякого «служебного» хлама, что докопаться до нужного объекта возможно — но проще уж выбрать по ID. Приблизительно, таким макаром this.items.items[0] я лишь докопаюсь до первой колонки и надо еще глубже)
К сожалению такой вариант не подходит, так как копание «руками» в объектах ExtJS гиблое дело, абсолютно бесполезное. В них столько всякого «служебного» хлама, что докопаться до нужного объекта возможно — но проще уж выбрать по ID. Приблизительно, таким макаром this.items.items[0] я лишь докопаюсь до первой колонки и надо еще глубже)
Если хочешь делать хорошо — надо копать, никуда не денешься.
Я вот и сейчас копаю, глубоко-глубоко =)
Я вот и сейчас копаю, глубоко-глубоко =)
Если элементы создавать таким образом.
Вот так можно обращаться, с использованием ООП.
Если что не понятно спрашивай, поясню.
Form = Ext.extend(Ext.FormPanel, {
initComponent: function() {
this.comboPeriod = new Ext.form.ComboBox({
fieldLabel: 'Период',
width: 200,
store: new Ext.data.ArrayStore({
fields: ['id','name'],
data: [
[0, 'текущий месяц'],
[1, 'за 14 дней'],
[2, 'за 7 дней'],
[3, 'вчера'],
[4, 'сегодня']
]
}),
value: 1,
listeners: {
select: {
fn: this.updatePeriod,
scope: this
}
}
});
this.comboPeriodNew = new Ext.form.ComboBox({
fieldLabel: 'Период',
width: 200,
store: new Ext.data.ArrayStore({
fields: ['id','name'],
data: [
[0, '30'],
[1, '14'],
[2, '7'],
[3, '1'],
[4, '1']
]
}),
value: 1
});
},
updatePeriod: function() {
//То обращаться вот так
this.comboPeriodNew.setValue('dfgdfgdg');}
});
Вот так можно обращаться, с использованием ООП.
Если что не понятно спрашивай, поясню.
О! Суть понял, пойду править код. Вроде бы очевидное решение, но глаз был замылен. Спасибо
Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.