EasyUI Forum

Hi,

I have the below markup: (nested tabs)
<div id="tt" class="easyui-tabs" data-options="tabWidth:275" style="width:1600px;height:850px;">
     <div title="Neo Lab" style="padding:20px;display:none;">
             <div id="neoLab" class="easyui-tabs" data-options="fit:true,plain:true">
                  <div id="getStrtd" title="Getting Started" data-options="tabWidth:200" style="padding:10px;"></div>
             </div>

             <div id="reportsLab" class="easyui-tabs" data-options="fit:true,plain:true">
                  <div id="getStrtd1" title="Getting Started" data-options="tabWidth:200" style="padding:10px;"></div>
             </div>

    </div>
</div>

I am doing the same action in both the tabs and in my code. I am need to assign the panel where the content should be loaded.

How do I get the parent tab of the selected tab:
for eg: I need to get the value as "reportsLab' or 'neoLab'.

I am able to get the element id of the child tab using the below code:

var imselectedTab = $('#neoLab').tabs('getSelected');
var imtitle = imselectedTab.panel('options').id;

How do I get the element id of its parent? i tried
var imselectedTab = $('#tt').tabs('getSelected');

This didnt work... Please give me a solution...

The 'id' value of your parent tabs component is 'tt'. Calling $('#tt') will get the parent tabs object. To get the parent tab panel, please call $('#tt').tabs('getSelected'). This statement will return the current selected tab panel. i.e. the 'Neo Lab' panel.