Ext JS - Learning Center

Talk:Ext 1 to 2 Migration Guide

From Learn About the Ext JavaScript Library

Jump to: navigation, search

This is awesome Brian! I'll take a closer look at the whole thing once I migrate my stuff over to 2.0. thank you,

--BernardChhun 13:05, 30 October 2007 (CDT)



Some examples showing how to dynamically add a region to a BorderLayout and a Panel to a TabPanel would be helpful. These were trivial to do with 1.x but are somewhat elusive when it comes to 2.x.

Thanks,

Scott



Regarding Scott's post, I had difficulty figuring this out as well. Perhaps incorporating some of the information from this post [1] would help. I've copied a key bit of Animal's example (referenced in that post) below for those who are curious how to add a panel to a tab.

Note that to participate in a Layout, any newly created Panel MUST be added to a 
parent Container, using that Container's add method. Then the Container's doLayout 
method must be called

If you are using a page layout, you must never simply render a Panel into the body 
of another Panel. That newly rendered Panel is then NOT owned by a parent, and will 
NOT particpate in any layout.

	var tp = Ext.getCmp('center-tab-panel');

//	Add just a config.
//	It will create the Container's defaultType (Usually, just an Ext.Panel)
//	Use an xtype (see http://extjs.com/deploy/dev/docs/?class=Ext.Component&member=xtype)
//      to create a different Component
	tp.add({
	    title: "Dynamically added Panel " + (++newTabCount),
	    closable: true,
	    autoLoad: 'add-tab-code.html'
	});

//	The Container will need to recalculate its View now that it has a new child Component
	tp.doLayout();

//	Make the newest tab visible
	tp.setActiveTab(tp.items.getCount() - 1);

--Dclaussen 09:19, 31 October 2007 (CDT)



Ok so I went ahead and created a full example of how to do this. See this post [2] for an example of how to find regions (really, the container within a region) and add components to it (including TabPanels, tabs, etc.).

As I understand it, you can't really dynamically add regions anymore. But you can dynamically add stuff to a particular region using the code shown in my example.

The process of finding a component in a region is still pretty clunky in the API... don't know if it's possible to clean this up prior to 2.0 being officially released, but it would be nice if it was easier than it is now.

--Dclaussen 17:28, 31 October 2007 (CDT)


FYI, while I agree that these suggestions are useful, they are a bit outside the focus of just getting a 1.x app converted to 2.0. They are more about understanding some of the intricacies of 2.0, which would come after getting a 1.x app working. This document is already overly long, so I don't want to add any more than is needed for its stated purpose. However, a 2.0 container/layout-specific tutorial would be a great, focused place to provide this info as well as other examples that people have been having issues with in the forums (like nesting certain components, etc.)

-Brian

  • This page was last modified on 15 November 2007, at 08:33.
  • This page has been accessed 5,321 times.