1

I have something like this on my HTML page.

 <html>
 <body>
      <div dojoType="dijit.layout.TabContainer" id="allTabContainer" style="width: 1150px; height: 490px" tabPosition="left-h" persist="true">
          <div dojoType="dijit.layout.ContentPane" id="firstTab_id" title="firstTab" >Content 1</div>
          <div dojoType="dijit.layout.ContentPane" id="secondTab_id" title="secondTab" >Content 2</div>
          <div dojoType="dijit.layout.ContentPane" id="thirdTab_id" title="thirdTab" ><jsp:include flush="true" page="thirdTab_page.jsp"></jsp:include></div>
      </div>
 </body>
 </html> 

I have 3 buttons on the thirdTab_page.jsp which on clicking would call the below selectTab javascript function. Please check the code for the same.

    <html>
    <body>

    <div dojoType="dijit.layout.BorderContainer" style="padding:10px; width: 50%;" id="borderCont">
                                      <button dojoType="dijit.form.Button" type="submit" id="firstTab" onclick="selectTab(this.id);">Tab1</button>
       <button dojoType="dijit.form.Button" type="submit" id="secondTab" onclick="selectTab(this.id);">Tab2</button>
       <button dojoType="dijit.form.Button" type="submit" id="thirdTab" onclick="selectTab(this.id);">Tab3</button>

    </div>
    </body>
    </html>

And then I have the javascript function which goes on like this.

    <script type="text/javascript"> 
    dojo.require("dijit.layout.TabContainer"); 
    function selectTab(tabId){
    var correctTabId = tabId+"_id";
    dijit.byId("allTabContainer").selectChild(correctTabId);
    }
    </script>

The tabContainer.selectChild doesn't seem to work in IE, but works perfect in Firefox. Please suggest if I have missed out something. Thanks in advance.

0 Answers0