Google Maps and TabSet

[roland1987]

Hi, I'm trying to implement an application with Google Maps and a TabSet. If I use the map in the first tab everything works fine.

public class MapTab implements EntryPoint {
	
	private TabSet topMenu = new TabSet();
	private HLayout Layout1 = new HLayout();
	private HLayout Layout2 = new HLayout();
	private SectionStack Stack1 = new SectionStack();
	private SectionStack Stack2 = new SectionStack();
	private SectionStackSection Sts1 = new SectionStackSection("Section1");
	private SectionStackSection Sts2 = new SectionStackSection("Section2");
	private SectionStackSection Sts3 = new SectionStackSection("Section3");
	private SectionStackSection Sts4 = new SectionStackSection("Section4");
	private Tab Tab1 = new Tab("Tab1");
	private Tab Tab2 = new Tab("Tab2");
	
	private MapWidget map = new MapWidget();
	
	public void onModuleLoad() {
		Stack1.addSection(Sts1);
		Stack1.addSection(Sts2);
		Stack1.setWidth("200px");
		Stack2.addSection(Sts3);
		Stack2.addSection(Sts4);
		Stack2.setWidth("200px");
		Layout1.addMember(Stack1);
		Layout1.addMember(map);
		Layout1.setWidth100();
		Layout1.setHeight100();
		Layout2.addMember(Stack2);
		Layout2.addMember(new Label("I am a Label"));
		Layout2.setWidth100();
		Layout2.setHeight100();
		Tab1.setPane(Layout1);
		Tab2.setPane(Layout2);
		topMenu.addTab(Tab1);
		topMenu.addTab(Tab2);
		topMenu.setHeight100();
		topMenu.setWidth100();
		  
		map.setWidth("500px");   
		map.setHeight("500px");
		map.addControl(new LargeMapControl());
		   
	    topMenu.selectTab(0);
	    RootPanel.get().add(topMenu);
	}
}

However, if I put the Map in the second Tab like this

		Layout1.addMember(Stack1);
		Layout1.addMember(new Label("I am a Label"));
		Layout1.setWidth100();
		Layout1.setHeight100();
		Layout2.addMember(Stack2);
		Layout2.addMember(map);

I'm getting the following error:
Uncaught JavaScript exception [java.lang.AssertionError: A widget that has an existing parent widget may not be added to the detach list

Do you have any ideas, how i could solve this ?

[karim]

I am getting the same exception. I am trying to added an image to each Tab.

[Isomorphic]

@karim How do you mean "add an image"? Are you talking about a SmartGWT widget or something else? Can you show your code?

[karim]

it is an image requested from my servlet.

	private Image pageviewImage = new Image();
	private Image pageviewModifiedImage = new Image();


    	TabSet topTabSet = new TabSet();  
    	topTabSet.setTabBarPosition(Side.TOP);  
    	topTabSet.setWidth100();  
    	topTabSet.setHeight("600");

    	Tab tPageView = new Tab("Page View");
    	Canvas can = new Canvas();
    	can.setStyleName("rua_canvas");
    	can.setOverflow(Overflow.AUTO);
    	can.setWidth100();
    	can.setHeight100();
    	can.addChild(pageviewImage);
    	can.setBackgroundColor("green");
    	tPageView.setPane(can);
    	
    	Tab tModPageView = new Tab("Modified Page View");
    	Canvas mcan = new Canvas();
    	mcan.setOverflow(Overflow.AUTO);  
    	mcan.addChild(pageviewModifiedImage);
    	tModPageView.setPane(mcan);
    	
    	Tab tPageSrc = new Tab("Page Source");
    	Tab tPageMetadata = new Tab("Page Metadata");
    	Tab tPagePostData = new Tab("Page Post Data");
    	Tab tSessMetadata = new Tab("Session Metadata");
    	
    	topTabSet.addTab(tPageView);  
    	topTabSet.addTab(tModPageView);
    	topTabSet.addTab(tPageSrc);
    	topTabSet.addTab(tPageMetadata);
    	topTabSet.addTab(tPagePostData);
    	topTabSet.addTab(tSessMetadata);
    	
    	tabCanvas = new VStack();  
    	tabCanvas.setStyleName("rua_canvas");
    	tabCanvas.setHeight("650");
    	tabCanvas.setAutoHeight();
    	tabCanvas.setCanDragResize(false);  
    	tabCanvas.addMember(topTabSet);
    	tabCanvas.setBackgroundColor("red");



    	String url = GWT.getModuleBaseURL() + "pages?pid=p000001";
    	pageviewImage.setUrl(url);
    	url = GWT.getModuleBaseURL() + "pages?pid=p000003";
    	Log.info("Requesting modified image URL:" + url);
    	pageviewModifiedImage.setUrl(url);

[Isomorphic]

It's not clear why GWT thinks the image has been attached to a parent, but the most predictable way to get around the issue is just to use the SmartClient Img widget instead, which provides analogous functionality.

[karim]

When I use Img object the image is displayed with dimensions 100x100 which is not the actual dimensions.

[Isomorphic]

See Image.imageType - "center" uses the natural
dimensions.