View Full Version : Scroll Ext Window

28 Jan 2013, 6:13 AM

I have an Ext window with components which don't fit into the space of the window so I get a vertical scroll bar in the window. I'm creating a help section and need to get the components into view so I that I can show a tooltip next to them. So how do I scroll individual components into view? The components could be anything.

I've tried window.scrollBy(), tried Ext.Element's scrollIntoView() & scoll() to no avail.


28 Jan 2013, 11:49 AM
Can you provide a small example of what you currently have?
When do you want to scroll when the items are not in view?


28 Jan 2013, 9:49 PM
A simple window with components.. For example I have

Ext.create('Ext.window.Window', {
layout : 'border',
items : [{

xtype : 'panel',

region : 'center',
items : [{
xtype : 'grid',
// grid config
}, {
xtype : 'form',
// form config
}, {
xtype : 'grid',
//grid config


xtype : 'tree',

region : 'west',



At any point of time, all three of the components are not visible together, unless the window is maximized. When I display a help tooltip, the component for which I'm going to display the tip has to scroll into view.
For example, say the user scrolls down and is currently viewing the last grid and then clicks on help, then the first grid should scroll into view and then the help tooltips come up and start showing what information each component is displaying.

28 Jan 2013, 10:09 PM
I got it working.. I had to turn off the autoScroll of the window, turn on autoScroll on the center panel and use the scrollBy function of the center panel.