PDA

View Full Version : [CLOSED] [4.2.0 beta] Ext.get(window).getHeight() causes JS error



Daniil
23 Apr 2013, 3:34 AM
REQUIRED INFORMATION

Ext version tested:

Ext 4.2.0 beta

Browser versions tested against:

Chrome
FireFox
IE9

DOCTYPE tested against:

<!DOCTYPE html>

Description:

Ext.get(window).getHeight() causes JS error. The same with Ext.fly. Uncaught TypeError: Cannot read property 'defaultView' of undefined

Steps to reproduce the problem:

Click the buttons

The result that was expected:

A window's height and width

The result that occurs instead:

A JavaScript error occrus

Test Case:


<!DOCTYPE html>
<html>
<head>
<title>Ext.get(window).getHeight() causes JS error</title>

<link rel="stylesheet" href="../resources/css/ext-all.css" />

<script src="../ext-all-debug.js"></script>

<script>
Ext.onReady(function () {
Ext.create("Ext.button.Button", {
renderTo: Ext.getBody(),
text: "Ext.get(window).getHeight()",
handler: function () {
alert(Ext.get(window).getHeight());
}
});

Ext.create("Ext.button.Button", {
renderTo: Ext.getBody(),
text: "Ext.fly(window).getWidth()",
handler: function () {
alert(Ext.fly(window).getWidth());
}
});
});
</script>
</head>
<body>

</body>
</html>

evant
23 Apr 2013, 4:06 AM
You're looking for



Ext.dom.Element.getViewSize();

Daniil
23 Apr 2013, 4:11 AM
Thank you, Evan.

Does it mean that I should not use Ext.fly, Ext.get for a window?

Well, there might be many other useful methods in Ext.dom.Element API. For example, I see that @Animal used the on method here (I see it is an old post, but anyway):
http://www.sencha.com/forum/showthread.php?108624#post507705

evant
23 Apr 2013, 4:45 AM
Windows can have events, but not dimensions.

Daniil
23 Apr 2013, 6:40 AM
Well, the method that you suggested

Ext.dom.Element.getViewSize();
use the getViewportWidth and getViewportHeight methods.

They are:

/**
* Retrieves the viewport height of the window.
* @static
* @return {Number} viewportHeight
*/
getViewportHeight: function(){
return window.innerHeight;
},

/**
* Retrieves the viewport width of the window.
* @static
* @return {Number} viewportWidth
*/
getViewportWidth: function() {
return window.innerWidth;
}

Does it not return a window's dimensions?:)

evant
23 Apr 2013, 9:49 PM
Ok, perhaps that was a bad example. My point is that the window API is different from other elements, so you'd need to conditionalize every Element method to check if the element is a window.

Daniil
24 Apr 2013, 9:42 PM
Ok, I got it. Thanks.