External link into tab content with ID?

[marcdet]

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

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/ajaxtabscontent/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.


<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.

[ddadmin]

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:


<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 (http://www.dynamicdrive.com/dynamicindex17/ajaxtabscontent/ajaxtabs_suppliment.htm).

[marcdet]

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?

[ddadmin]

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:


if (selectedtab!=-1) //if a valid default selected tab index is found

and replace it with the below instead:


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:


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