Preserve pane after tab close

[code08]

I have a tab set that is loaded for an application. I want to "prelaod" all of the tabs contents as seperate panes and then call tabSet.addTab with the pane set to the ID of an existing widget. This works fine on the first load, but after the tab is closed, adding the same tab with the same widgetId as previous load results in an empty tab.

I suppose this because the pane is automatically destroyed when the tab is closed. I know I could use oncloseclick on the tabset and use tabSet.updateTab(null) to work around this, but then I'd have to have some huge if statement on the closeclick method. Instead, is there a way to specify on the tab, or override a method on the tab to NOT destroy the pane when the tab is closed?

[Isomorphic]

It doesn't seem like you need an "if" statement? closeClick passes you the tab.

[code08]

So I guess stick a property on the tab, "preserve" for exampe, and if true call the tabset.updateTab(tab, null) to avoid destruction of the pane. So close click would look like this...

closeClick: new function(tab) {
     if(tab.preserve) {
          updateTab(tab, null);
     }
     removeTab(tab);
}

[Isomorphic]

That looks about right, although you got a little creative with the JavaScript syntax :)

[code08]

This doesn't seem to be working for me, I've included the below closeClick in my tabset and it's not firing when I click the "X" to close a tab (the tab just closes with no alert). Probably something simple I'm missing?

isc.TabSet.create({
    ID: "mainTabContainer",
    tabBarPosition: "top",
    width: "100%",
    height: "100%",
    autoDraw: false,
    tabs: [
        {title: "Dashboard",
         pane: dashboardTabLayout}
    ],
    closeClick: function(tab) {
		alert("close click");
	}
});

[Isomorphic]

Hi code08,
Thanks for keeping us informed about this. We actually have a bug whereby the close icon is failing to fire closeClick.
We've now resolved this internally, so the issue will go away as of our next release (SmartClient 7.0).
In the meantime you can work around this issue by essentially providing your own custom close icon - something like this:

isc.TabSet.create({
  ID:"myTabSet",
  [i]... various properties[/i]
  tabs:[
    {title:"Tab 1", iconOrientation:"right", 
      icon:{src:"[SKIN]/TabSet/close.png",
            click:function (tab) { myTabSet.removeTab(tab); }
      }
    }
   ]
});

[davidj6]

Will there be a patch issued for this bug for 6.5.1? I ran into this today but I did create my own patch to _tabIconClick that seems to be working.

[magnus]

I tried this but it caused a JavaScript error. Turns out you need to return false from the click handler or the event will be bubbled up, I suspect trying to now access the tab that no longer exists. Here's a "complete" example that worked for me.

var myTabSet = isc.TabSet.create({
	width: "100%",
	height: "100%",
	tabs: [
       {title: "111",
	    iconOrientation:"right",
		icon:{src:"[SKIN]/TabSet/close.png",
			click:function (tab) {
				myTabSet.removeTab(tab);
				// my other code here
				return false;
			}
		},
		pane: isc.Canvas.create({contents:"text 1"})},
       {title: "222",
	    iconOrientation:"right",
		icon:{src:"[SKIN]/TabSet/close.png",
			click:function (tab) {
				myTabSet.removeTab(tab);
				// my other code here
				return false;
			}
		},
		pane: isc.Canvas.create({contents:"text 2"})}
	]
});

[Orelia]

Retrieve the value in the pane for a Tab (Tabset)

Hello,

I'd like to dynamically retrieve the contents of a tab on a TabSet?

When I make a :

 
Tab tab = new Tab ();
tab.setPane (any layout);

How I do to retrieve the value in the pane (getPane() not exist ?!?) ?

Thanks !

[RHelgeson]

var tabIndexOrID;

// set tabIndexOrIDhere to a valid value

var tabPaneContents = TabSet.getTab(tabIndexOrID).pane

[Orelia]

When I do that, I do not have a method Pane ... I have only setPane

Thanks

[RHelgeson]

It's not a method it's a property.

But I am surprised that it's not there, we use it all over the place:

for(i = 0; i < this.tabs.length; i++){
    if(this.tabs[i].pane.valuesHaveChanged && this.tabs[i].pane.valuesHaveChanged()){
        retVal = true;
        break;
    }
}

tabSet.getSelectedTab().pane.valuesHaveChanged();

var form = this.parent.billToTabSet.tabs.find({reviewField: columnName}).pane;

I just looked at your code again and I now realize that's probably Java, not javascript client code. I got confused because you hijacked a thread about client side JS code :)

Well, I'll post these here anyway for anyone looking for this functionality

[Orelia]

Ho , sorry !

This is my fault. Yes, this is a Java code and not Javascript Code...

[Isomorphic]

SmartClient has getTabPane(). We're looking at why this doesn't appear in SmartGWT yet.

[Orelia]

ok thanks,

Let me know when this property will be added because I need this property.

Thanks again !