Javascript-форум (https://javascript.ru/forum/)
-   ExtJS (https://javascript.ru/forum/extjs/)
-   -   Получить элемент в window по классу (https://javascript.ru/forum/extjs/29029-poluchit-ehlement-v-window-po-klassu.html)

alex3112 11.06.2012 23:10

Получить элемент в window по классу
 
Здравствуйте. Задача:
Есть элемент widget.inspector, наследующий Window.
У него есть кнопка xtype: 'buttongroup' и элемент iframe.
Необходимо в обработчике щелчка по кнопке получить объект iframe для изменения его свойства src. У iframe есть только свойство class, id у него нет. Очень прошу помочь.

khusamov 11.06.2012 23:14

var result = inspector.getEl().select("iframe");
var iframe = result.elements[0];
iframe.set({src: "newsrc"});

http://docs.sencha.com/ext-js/4-1/#!...-method-select
http://docs.sencha.com/ext-js/4-1/#!...ent-method-set
http://docs.sencha.com/ext-js/4-1/#!...mpositeElement

khusamov 11.06.2012 23:19

Что-то вы по ходу меняете задачу))))

khusamov 11.06.2012 23:20

Если iframe один, то должно сработать.

alex3112 11.06.2012 23:44

А как получить объект inspector? this и event ссылаются на объект button.

khusamov 11.06.2012 23:54

Цитата:

А как получить объект inspector? this и event ссылаются на объект button.
this.up("inspector")

alex3112 11.06.2012 23:57

this.up() : [Exception: TypeError: Object [object Object] has no method 'up']

khusamov 11.06.2012 23:58

Раз так, то приводите весь код.

alex3112 12.06.2012 00:00

Inspector.Controller:

Ext.define('AM.controller.Inspector',{
extend: 'Ext.app.Controller',
views: ['inspector'],



init: function(options){
this.control({
'inspector button[action=goto]':{click: this.gotoPage, delegate: this},
'inspector button[action=inspect]':{click: this.inspect},
'inspector': {id: options.id, destroy: this.closeWin, move: this.saveWin}
})
},

//открыть страницу
gotoPage: function(event){
var url = Ext.getCmp('url').getValue();
if(!/^http:\/\//.test(url)){
url = 'http://'+url;
//url = 'http://interface/index.php?controller=content&action=getHttp&addres s='+aurl;

}
var iframe = Ext.get('.container');

iframe.dom.src = url;
Ext.getCmp('url').setValue(url);
this.win.setTitle(url);
}
...




Inspector.view:

Ext.define('AM.view.inspector', {
extend: 'Ext.window.Window',
alias: 'widget.inspector',

initComponent: function(options){

var toolbar = new Ext.Toolbar({
defaults:{
iconAlign: 'top'
},
items: [
{text:'Назад',iconCls:'back', action: 'back'},
{text:'Вперед',iconCls:'forward'},
{text:'Обновить',iconCls:'reload'},
{text:'Остановить',iconCls:'stop'},
{text:'Домой',iconCls:'home', action: 'goHome'},
'-',
{
xtype: 'buttongroup',
items:[
{xtype:'textfield',id:'url',width:250,enableKeyEve nts:true},
{iconCls:'goto', action: 'goto'}
]
},
{text: 'Инспектировать', action: 'inspect'},
'->',
{text:'Закладки',iconCls:'book'}
]
});

if(this.idl) this.id = this.idl;
var url = this.url == null ? '' : this.url;
//this.height= 400;
//this.width= 600;
//this.x= 450;
//this.y= 250;
this.title= 'Инспектор';
this.tbar = toolbar;
this.closable= true;
this.maximizable= true;
this.maskDisabled= true;
this.plain= true;
this.layout= 'fit';
this.bodyStyle= 'background-color:#fff';
//this.html= '<iframe id="container" src="" style="width:100%;height:100%;border:none"></iframe>';
this.items=[{
xtype : "component",
autoEl : {
tag : "iframe",
src : url,
cls: 'container'
},
listeners: {
afterrender: function () {
this.getEl().on('load', function () {
//console.log('loaded');
});
}
}
}];


this.callParent(arguments);
}
})

alex3112 12.06.2012 00:03

Кнопка с action='goto' и соответствующий обработчик в контроллере

khusamov 12.06.2012 00:04

Включите подсветку кода. Каша ведь на экране.

khusamov 12.06.2012 00:09

Так у вас обработчик находится не в инспекторе оказывается. А в контроллере. Конечно up тут не будет работать.

'inspector button[action=goto]':{click: this.gotoPage, delegate: this},

khusamov 12.06.2012 00:12

Где у вас происходит создание экземпляра класса AM.view.inspector?

khusamov 12.06.2012 00:14

В общем я бы в этом случае при создании экземпляра AM.view.inspector сохранил бы на него ссылку в контроллере, чтобы в методе gotoPage иметь возможность ссылаться на окно.

alex3112 12.06.2012 00:33

Решил проблему:
var iframe = event.findParentByType('inspector').getEl().select ('iframe').elements[0];

Ext.get(iframe).set({src: "http://habrahabr.ru"});

Спасибо за помощь.

khusamov 12.06.2012 06:06

Ну, это какое-то не спортивное решение: event.findParentByType
Как заплатка пойдет.

alex3112 13.06.2012 00:15

Согласен. Но как сделать по-другому пока что не соображу.
И еще: не могу задать значение textfield c классом url.

Пробую:
event.findParentByType('inspector').getEl().select ('.url').elements[0];

возвращает элемент таблицы. У него действительно есть класс url, но это не input. Метод setValue к нему неприменим. Не подскажете как быть?

khusamov 13.06.2012 01:00

У вас textfield компонент. Соответственно его надо искать не как элемент DOM, а как компонент Ext.

Цитата:

Но как сделать по-другому пока что не соображу.
Я же написал -- хранить в контроллере.


Часовой пояс GMT +3, время: 16:18.