dhtmlx Layout error

We have created an html page with a number of tab(We are not using dhtmlx tab). On click of a tab we want different content to be loaded in a div below. On click of one of the tab we want to load an html page using the following piece of code. The initLayout() function will initialize a dhtmlx layout in a div on the page being loaded using the tabURL. We are getting an error on line 12 of the dhtmlxLayout.js. Would like to know if there is something wrong with our approach and if there is any other way to achieve the same. We do not want to put all content on one page.

function onTabSelect(selTab){
dhtmlxAjax.get(tabURL, function(loader){
alert(loader.xmlDoc.responseText); /This alert works fine/

function initLayout(){
dhxLayout = new dhtmlXLayoutObject(“refDataLayout”, “2U”);
alert(“hello 2”);/This alert does not appear/
dhxLayout.cells(“a”).setText(“Reference Data”);
statusBar = dhxLayout.attachStatusBar();

Please help.

Make sure that refDataLayout container exists on the page.

If the problem still occur, please attach the complete demo (I need only code that relates to layout initialization)

Thanks for the reply. Please find attached the code snippet.
test.zip (11.8 KB)

The layout container is added, but its height is null. Try to set some height to it to solve the problem: