how to get the id in extjs newly opened browser

Question

I am creating a popup window using the following code :

var window = Ext.create('Ext.window.Window',{
    title : headerMsg,
    width : 350,
    me:me,
    height : 250,
    layout : 'fit',
    plain : true,
    name : 'exportWin',
    id : 'exportWin' + (++eWin),
    buttonAlign : 'center',
    items : [{
        xtype : 'box',
        autoEl : {
            tag : 'iframe',
            src : url,
            id : eWin,
            name : 'ExportFrame',
            height : '100%',
            width : '100%',
            style : 'cursor:pointer;top:10px'
        }
    }
    ]
});
window.show();

Everything is working fine and now I need to get the id in the newly opened browser.

I tried window.id, self.id and this.id but nothing works. but window.name is working it is alerting 'ExportFrame' as expected but window.id is not alerting 'eWin' variable it is alerting as undefined Thanks in advance !

hwsw · Answer 1 · 2016-01-25T09:28:35.943

Ext.create returns an object, so you can simply use window.id to access the object.

To get the ID of the iframe, you can use this:

window.items.items[0].autoEl.id

I tested it with the following modified script of yours:

var eWin = 1337;
var Ywindow = Ext.create('Ext.window.Window',{
            title : 'dummy',
            width : 350,
            //me:me,
            height : 250,
            layout : 'fit',
            plain : true,
            name : 'exportWin',
            id : 'exportWin' + (++eWin),
            buttonAlign : 'center',
            items : [{
                xtype : 'box',
                autoEl : {
                    tag : 'iframe',
                    src : 'https://ccc.de',
                    id : eWin,
                    name : 'ExportFrame',
                    height : '100%',
                    width : '100%',
                    style : 'cursor:pointer;top:10px'
}}]});
Ywindow.show();
console.log(Ywindow.items.items[0].autoEl.id);

But as you write in your code its simply:

eWin or ++eWin. // in our case: 1338

I prefer references over Ids. This gives me much more power from the MVVM and MVC patterns. https://docs.sencha.com/extjs/6.0/application_architecture/view_controllers.html

Btw, calling a var window is not optimal - window is a global JS browser object.

Therefore i created a fiddle for demo purposes, this should work on ExtJS 4+.

https://fiddle.sencha.com/#fiddle/14do

(Take a look in the console, you will find both ids)

Hii tried window.id but it is not showing the iframe window ID — vinod kumar, Jan 24 '16 at 13:54
Sure, window.id shows id : 'exportWin' + (++eWin). The iframe id is eWin, right? — hwsw, Jan 24 '16 at 14:05
Hi first of all I would like to thank you so much for your quick replies. No, actually when i use window.id it is showing undefined anyhow but what i am expecting to see is 'exportWin' + (++eWin) (i.e., exportWin1, exportWin2, exportWin3...) not ewin — vinod kumar, Jan 25 '16 at 06:27
The id of the iframe will be eWin, the id of the panel will be 'exportWin' + (++eWin). Take a look in the fiddle, there you can find a way to get both Ids. — hwsw, Jan 25 '16 at 09:29
Hey thank you...!! actually you are logging the values in the app.js but what I need is to fetch the ID from newly created frame that means from the window that has been created from window.show(); function. I tried self.id, window.id and this.id but nothing works — vinod kumar, Jan 25 '16 at 09:49

score 0 · Answer 2 · edited May 23 '17 at 12:23

0

If you want to select id property of recentrly created Ext.window.Window you can just use window.getId().

If you want to select actual id of child iframe you can use something like Ext.dom.Query.select('iframe')[0].id.

Working fiddle

More about navigating through DOM with ExtJS in this answer.

edited May 23 '17 at 12:23

Community

1
1

answered Jan 22 '16 at 15:33

Sergey Novikov

4,096
7
33
59

Hey thank you...!! actually you are logging the values in the app.js but what I need is to fetch the ID from newly created frame that means from the window that has been created from window.show(); function. I tried self.id, window.id, this.id but nothing works – vinod kumar Jan 25 '16 at 09:48
I see, you want get ID from iframe JS code. I guess you have to pass ID as part of iframe url (or toher way when you load iframe content) because `` tag is part of main browser window (where ExtJS works) and iframe content executed in other window.. – Sergey Novikov Jan 25 '16 at 10:54
Actually check this answer, I guess its what you lookin for - http://stackoverflow.com/a/7647123/2667065 – Sergey Novikov Jan 25 '16 at 10:59

how to get the id in extjs newly opened browser

2 Answers2