Results 1 to 4 of 4

Thread: External link into tab content with ID?

  1. #1
    Join Date
    Jul 2008
    Posts
    6
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default External link into tab content with ID?

    1) Script Title: Ajax Tabs Content Script (v 2.2)

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...tent/index.htm
    3) Describe Question:

    Does anyone have an idea how to use an external link into the tabbed content using ID's instead of index #'s?
    Using the standard code as below, I would like to link into the tabbed content with the following (or something similar?);
    <a href="target.htm?flowertabs=myfavorite">Target Page</a>
    which would lead me to target.htm with external2.htm tab selected and showing in the DIV.

    Code:
    <ul id="countrytabs" class="shadetabs">
    <li><a href="external1.htm" rel="countrycontainer" class="selected" id="thebestest">Tab 1</a></li>
    <li><a href="external2.htm" rel="countrycontainer" id="myfavorite">Tab 2</a></li>
    <li><a href="external3.htm" rel="countrycontainer" id="justok">Tab 3</a></li>
    <li><a href="external4.htm" rel="countrycontainer" id="notsogood">Tab 4</a></li>
    </ul>
    
    <div id="countrydivcontainer" style="border:1px solid gray; width:450px; margin-bottom: 1em; padding: 10px">
    </div>
    
    <script type="text/javascript">
    
    var countries=new ddajaxtabs("countrytabs", "countrydivcontainer")
    countries.setpersist(true)
    countries.setselectedClassTarget("link") //"link" or "linkparent"
    countries.init()
    
    </script>
    As I would like to use the script, the number of tabs are dynamic based on the content available. While I know I always want to link to "myfavorite" from pages outside the tabbed area, I will never know ahead of time what position it is in. Any help is appreciated.

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

    Default

    So you're asking how to select a particular tab based on its ID and via a remote link? If your link is on the same page as where your tab contents are (versus different), then the script already supports this, such as the second example below:

    Code:
    <p><a href="javascript: countries.expandit(2)">Select 3rd Tab</a></p>
    <p><a href="javascript: countries.expandit('favorite')">Select Tab with ID "favorite"</a></p>
    This doesn't work for remote links, however. More info here.
    Last edited by ddadmin; 07-27-2008 at 08:21 AM.

  3. #3
    Join Date
    Jul 2008
    Posts
    6
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Exactly. I am trying to link in from a remote page to the tabbed content, and I need the link to land with a particular tab open but I can not use the index (position) because the number of tabs is variable depending on the content. I could assign an ID to the tabs however, if that would help. Any thoughts?

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

    Default

    Sure, to extend the remote URL tab selection feature to not only support index based selecting, but also, the id of the desired tab, find the below line in the .js file:

    Code:
    if (selectedtab!=-1) //if a valid default selected tab index is found
    and replace it with the below instead:

    Code:
    		var selectedtabidfromurl=window.location.search.match(new RegExp(this.tabinterfaceid+"=(\\w+)", "i")) //check for "?tabinterfaceid=tabid" in URL
    		if (document.getElementById(RegExp.$1))
    			this.expandit(RegExp.$1)
    		else if (selectedtab!=-1) //if a valid default selected tab index is found
    Now, assuming the tab you wish to select is given an ID of "favorite", on a different page, the link to select it on the target page would look something like:

    Code:
    <a href="target.htm?tabinterfaceid=favorite">Target Page</a>

  5. The Following User Says Thank You to ddadmin For This Useful Post:

    marcdet (07-28-2008)

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
  •