View Full Version : Button on toolbar in nested list leaf that opens new panel

1 Sep 2011, 4:23 AM
The topic pretty much sums it up. I have been able to open a map (which uses Google's geocoding service) in its own panel but am having trouble getting it to behave. I also need to add a back button.

What I need to do is add a button to the righthand side of the toolbar - but only in the leaf node of a nested list. The button would say "Map" and when you click it the map panel would load. Then, as soon as the user navigates away from the map view it would destroy the panel to save on memory.

Any ideas on what to look for or examples out there?

1 Sep 2011, 4:24 PM
I solved this by adding items to the detailCard and setting it to layout: 'card'

I then added buttons to dockedItems: [{xtype: 'button'}] with handlers at the top of detailCard to navigate between each card.

For some reason I thought this was a big deal when it actually wasn't. I now have a nested list that drills down to the leaf card (detailCard) and splits it into 3 cards, each able to access the data from the original nestedlist..

12 Sep 2011, 8:25 PM

Can you tell me exactly how you did this? Im new to the whole Sencha scenario.

Im basically looking to do the exact same thing. When i reach the Map panel I need to add 2 other buttons on the toolbar of the nestedlist leaf that I have reached.

Thanks in advance :)


13 Sep 2011, 5:13 AM

Basically I followed the Nested List example provided here: http://www.sencha.com/learn/intro-to-the-nested-list-component/

Then instead of something like:

detailCard = new ExtPanel({

I used:

detailCard = new ExtTabPanel({

I was then able to load panels and carousels inside of the nested list "leaf" card. Docked my navigation to the top and used that to switch between them. Getting data into the tabs is another story but this should help. Was this what you were looking for?