Big Tabbar -> tabs should only be loaded if clicked

Suite and Optimus Suite 5
#1

Hi,

i’ve got a big tabbar with multiple tabbars inside and the problem is that each time i first load the page, all the tabs are loaded, so that it needs aboud 30 secounds to be completely loaded.

is there a way to define, that the content of each tab is only loaded, if the tab is clicked/activated?

My code looks like (i use attachedURLs):

[code]

myPage 
<script src="../dhtmlxSuite_v50_std/codebase/dhtmlx.js"></script>
<style>
	html, body {
		width: 100%;
		height: 100%;
		margin: 0px;
		padding: 0px;
		overflow: hidden;
	}
</style>
<script>
	var tabbar1, tabbar2, tabbar3, ...;
	var initedTabs = {};
	function doOnLoad() {
		
		tabbar1 = new dhtmlXTabBar("my_tabbar");
		tabbar1.setOffsets({
			top: 10,
			right: 10,
			bottom: 10,
			left: 10
		});
	
		
		tabbar1.setSkin('dhx_skyblue');
		tabbar1.addTab("a1", "text123", null, null, true);
			tabbar2 = tabbar1.tabs("a1").attachTabbar();
			tabbar2.addTab("a1", "16x");
			tabbar2.tabs("a1").setActive(true);
				tabbar3 = tabbar2.tabs("a1").attachTabbar();
				
				tabbar3.addTab("a0", "mytext");
					tabbar3.tabs("a0").setActive(true);
					
					ranorexTabbar = tabbar3.tabs("a0").attachTabbar();
						ranorexTabbar.addTab("0", "content0");
							ranorexTabbar.tabs("0").attachURL("http://myURL.php", null,  true);
						ranorexTabbar.tabs("0").setActive(true);
						ranorexTabbar.addTab("1", "mytext");
							ranorexTabbar.tabs("1").attachURL("http://myURL.php", null,  true);
						ranorexTabbar.addTab("5", "mytext");
							ranorexTabbar.tabs("5").attachURL("http://myURL.php", null,  true);
						ranorexTabbar.addTab("6", "mytext");
							ranorexTabbar.tabs("6").attachURL("http://myURL.php", null,  true);
						ranorexTabbar.addTab("100", "mytext");
							ranorexTabbar.tabs("100").attachURL("http://myURL.php", null,  true);
						ranorexTabbar.addTab("101", "mytext");
							ranorexTabbar.tabs("101").attachURL("http://myURL.php", null,  true);
				
				tabbar3.addTab("qq", "mytext");
					jmeterTabbar = tabbar3.tabs("qq").attachTabbar();
						jmeterTabbar.addTab("a1", "content1");
						jmeterTabbar.tabs("a1").attachURL("http://myURL.php", null,  true);

		//... more tabbars
	}
</script>
[/code]
#2

Unfortunately there is no lazy loading in the dhtmlxtabbar.
You may try to use the onTabClick event to control the tab opening and load its content on the first selecting.
Something like:
myTabbar.attachEvent(“onTabClick”, function(id, lastId){
if (id==your_tab_id && !myTabbar.tabs(your_tab_id).getAttachedObject())
myTabbar.tabs(your_tab_id).attachURL(“content.html”);
});