Results 1 to 2 of 2

Thread: Nesting Ajax Tabs - Refresh Problem in IE and Chrome

  1. #1
    Join Date
    Jan 2010
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Nesting Ajax Tabs - Refresh Problem in IE and Chrome

    1) CODE TITLE:
    Nesting Ajax Tabs
    http://www.dynamicdrive.com/dynamici...uppliment2.htm

    2) DESCRIPTION:
    When the refresh button is clicked in IE the nested tabs still display, however the ajax loaded content disappears and when you click a nested tab it opens it in a new page.

    In Chrome the entire page refreshes and reloads the first tab and it's external content.

    Firefox works fine... And the example - http://www.dynamicdrive.com/dynamici...uppliment2.htm - works in all browsers.

    Code:
    <div style="float:left; padding-right:4px;">
    <ul id="countrytabs" class="verticalTabs">
    <li><a href="external1.htm" rel="countrycontainer" class="selected">Administrative Units</a></li>
    <li><a href="external2.htm" rel="countrycontainer">Tab 2</a></li>
    <li><a href="external3.htm" rel="countrycontainer">Tab 3</a></li>
    <li><a href="nested.htm" rel="countrycontainer">Tab 4</a></li>
    </ul>
    </div>
    <div id="countrydivcontainer" style="width:760px; height:640px; margin-bottom:1em; padding:10px; float:left; border:1px solid #bebebe; background:#dedede"></div>
    
    <script type="text/javascript">
    var countries=new ddajaxtabs("countrytabs", "countrydivcontainer")
    countries.setpersist(true)
    countries.setselectedClassTarget("link") //"link" or "linkparent"
    countries.init()
    
    countries.onajaxpageload=function(pageurl){
    	if (pageurl.indexOf("nested.htm")!=-1){
    		provinces=new ddajaxtabs("provincetabs", "provincedivcontainer")
    		provinces.setpersist(true)
    		provinces.setselectedClassTarget("link") //"link" or "linkparent"
    		provinces.init()
    	}
    }
    </script>
    And then nested.htm:
    Code:
    <div style="padding:0px; float:left; width:762px; height:620px; ">
    <ul id="provincetabs" class="horizontalTabs" >
    <li><a href="external5.htm" rel="provincedivcontainer">Tab 5</a></li>
    <li><a href="external6.htm" rel="provincedivcontainer">Tab 6</a></li>
    <li><a href="external7.htm" rel="provincedivcontainer">Tab 7</a></li>
    </ul>
    <div id="provincedivcontainer" style="padding:10px; float:left; clear:both; background:#FFF; border:1px solid #bebebe; width:738px; height:597px;">
    </div>
    </div>

  2. #2
    Join Date
    Aug 2004
    Posts
    10,143
    Thanks
    3
    Thanked 1,008 Times in 993 Posts
    Blog Entries
    16

    Default

    Please post a link to the page on your site that contains the problematic script so we can check it out.
    DD Admin

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •