Start Building Professional
Web Apps Today


 
Categories Question details Back To List
Question  posted by Carmine Marino on Jul 09, 2009 08:06
open dhtmlx forum
Tabbar and IFrame question

We are seeing some strange behavior when calling tabbar.tabWindow(tab_id). When all the tabs are predefined in the xml file it returns the iframe handle.

But when we dynamically add a tab to the tabbar by calling addTab. Then calling tabWindow on the new tab it returns undefined/null. See the example code snippit below.

Here is an example xml document for a tabbar

<?xml version='1.0'?>
<tabbar hrefmode='iframes-on-demand'>
<row>
<tab id='a1' width='100px' src='' >A1</tab>
<tab id='a2' width='100px' selected='1'>A2</tab>
</row>
</tabbar>


in our jsp
<script>
var tabbar=new dhtmlXTabBar("a_tabbar");
tabbar.setImagePath("dhtmlxTabbar/codebase/imgs/");
     tabbar.loadXML("test.xml" , function(){
     tabbar.tabWindow('a2').name="a2"; // <<<< this works fine since a2 is defined in xml the
// tabWindow returns the iframe handle
     });

tabbar.addTab("a3","a3","100px"); // Add new tab dynamically....

tabbar.tabWindow("a3").name="a3"; //<<<< This fails because tabWindow is returning null.
// Is there something we are missing here?
</script>

Thank you
Carmine Marino


</script>


Answer posted by Alex (support) on Jul 09, 2009 09:12
Hello,

tabWindow method returns iframe object only when you use iframe-based modes: iframe, iframes and iframe-on-demand.

tabbar.setHrefMode("iframes")
tabbar.addTab("a3","a3","100px"); // Add new tab dynamically....
tabbar.setContentHref("a3",href);
tabbar.tabWindow('a3').name="a3";

Answer posted by Carmine Marino on Jul 09, 2009 09:54

You guys rock!

I'll give this a try!  thank you.

 

carmine

Answer posted by Carmine Marino on Jul 09, 2009 10:35

Thank you very much for your fast response.  it's working, but I noticed something a bit weird. 


   var tabbar=new dhtmlXTabBar("a_tabbar");
   tabbar.setImagePath("/ims/scripts/dhtmlx/dhtmlxTabbar/codebase/imgs/");
  
   //tabbar.loadXML("test.xml");    // <<<<<<<<<<<<<<<<  HERE If I uncomment this line I only see the two tabs "A1 and A2 that are defined in the xml document. I don't see the REVIEW TAB 
   
   tabbar.setHrefMode("iframes");
   
   tabbar.addTab("REVIEW","REVIEW","100px");
   tabbar.setContentHref("REVIEW", ""); 
   tabbar.tabWindow("REVIEW").name="REVIEW";

   Is it possbile to load from an xml file and then dynamically add new tabs?  If I comment the loadXML call I see the REVIEW tab.

XML doc:

<?xml version='1.0'?><tabbar  hrefmode='iframes-on-demand'><row><tab id='a1' width='100px' src='' >A1</tab><tab id='a2' width='100px' selected='1'>A2</tab></row></tabbar>

Thank you.

carmine

Answer posted by Alex (support) on Jul 10, 2009 03:32

Hello,

if you load tabbar from xml and add tab dynamically, addTab method should be called after xml loading and using setHrefMode isn't necessary in this case:

var tabbar=new dhtmlXTabBar("a_tabbar");

tabbar.setImagePath("/ims/scripts/dhtmlx/dhtmlxTabbar/codebase/imgs/");

tabbar.loadXML("test.xml",onLoadingEnd)

function onLoadingEnd(){

 tabbar.addTab("REVIEW","REVIEW","100px");
 tabbar.setContentHref("REVIEW", ""); 
 tabbar.tabWindow("REVIEW").name="REVIEW";

});