PDA

View Full Version : How do you scroll to the top of a tabPanel



profunctional
2 Nov 2010, 1:16 PM
I have a tabPanel, and inside the tabPanel is a formPanel. When I view an item1 and scroll to the bottom, the next time i visit the page to view item2 the view is at the last location. I'd like to reset the scroll to the top of the page.

I tried tabPanel.scroller.scrollTo

but scroller is null.

How do I do this?

aaronbartell
2 Nov 2010, 1:36 PM
How interesting! I am in need of something similar. Before I had my tabPanel defined in a ViewPort I was able to scroll to the top using this:

scroll(0,0);

... so hopefully that helps you.

I am not sure where you found "scroller" as I don't see that in the API documentation.

dloomer
2 Nov 2010, 2:26 PM
I may be hijacking, but think it's similar: is there a way to listen for a tap of the status bar (the native bar at the top of the screen with the clock) on an iPhone? That's supposed to scroll to the top automatically. For apps with native scrolling this works, but if you use Sencha's scrolling for panels inside of panels, I don't see a way to accomplish this.

I figure the chances have to be 100% that someone has brought this up before, but I couldn't find anything through a search.

mikeyroy
3 Nov 2010, 9:09 AM
You can add something like this to a listener that is fired with each page load, depending on the situation, beforeactivate, activate, show, etc...


this.TheList.scroller.scrollTo({x: 0, y: 0}, true);


The scroller will either be attached to a List or the Panel, you can use Chrome's Developer Tools to figure out which object has the scroller if you're unsure (Ctrl+Shift+I, then go to Console, and start typing the name of your parent object and work your way down, hit Enter to view the actual Object)

@dloomer, if you're using Phonegap you will need to check with them to see if they have exposed that functionality to Javascript, if you're not using an app wrapper, then you probably won't have access to those events.

profunctional
3 Nov 2010, 3:52 PM
The panel object has no scroller property. How are you guys accessing this object?

mikeyroy
3 Nov 2010, 3:59 PM
The panel object has no scroller property. How are you guys accessing this object?

The Panel object will have a scroller if scroll is set to anything but false on the panel, this includes if a default was set in a parent object for scroll to anything but false. If your panel doesn't scroll, but rather your list then you need to look for scroller in the List object.

lteti77
11 Nov 2010, 4:48 AM
hi, i tried to access the scroller object for a list but it's undefined...
i'm using 1.00RC. How can i force a list to scroll to the top element?
thanks

johnwards
11 Nov 2010, 5:09 AM
You can only get access to the scroller object on a panel after render. It doesn't exist until render is called.

So you can use the afterrender event to do what you need to do.

lteti77
11 Nov 2010, 8:29 AM
You can only get access to the scroller object on a panel after render. It doesn't exist until render is called.

So you can use the afterrender event to do what you need to do.

thanks a lot,
it works now ;-)

profunctional
11 Nov 2010, 8:55 AM
How do I do this for a Panel? I tried the below, but the scroller is undefined.

listeners: {
afterrender: function(panel){
panel.scroller.scrollTo({x: 0, y: 0}, true);
}
},

johnwards
11 Nov 2010, 2:48 PM
this.scroller.scrollTo({x: 0, y: 0}, true);