我们要在TabContainer下面创建ContentPane,首先当然需要一个已经存在的TabContainer。以下是HTML源码:
<div data-dojo-type="dijit.layout.TabContainer" data-dojo-attach-point="tabContainer">
<div data-dojo-type="dijit.layout.ContentPane" data-dojo-props='title: "搜索条件"'>
<div class="searchConditionArea">
<label>ITCCXX FOR DEMO</label>
</div>
</div>
</div>
<div data-dojo-type="dijit.layout.ContentPane" data-dojo-props='title: "搜索条件"'>
<div class="searchConditionArea">
<label>ITCCXX FOR DEMO</label>
</div>
</div>
</div>
我们在tabContainer下面动态的创建Tab,如下代码:
createAdvancedSearchTab :
function
(event){
var
tab = ecmwdgt.getBean(
"advancedSearchContentDijit"
,{
title: event.payload.item.label,
closable:
true
});
this
.tabContainer.addChild(tab);
this
.tabContainer.selectChild(tab);
tab.loadSearchCondition();
}
也许读者不太理解
ecmwdgt.getBean(
"advancedSearchContentDijit")的作用。这里是在创建Tab时,在Tab的Content中加载
advancedSearchContentDijit
页面,而后面的
tab.loadSearchCondition()也是加载的
advancedSearchContentDijit
页的一个方法。