PDA

View Full Version : level three nested Ajax tabs



sandesh
04-02-2015, 09:47 AM
1) Script Title: Level Three nested ajax tabs required

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/ajaxtabscontent/ajaxtabs_suppliment2.htm

3) Describe problem:
hello everyone,
I am new to Ajax and this is the first time i am using Ajax. I have been developing a web application prototype and i am using the ajax tabs from the dynamic drive ajax tab as shown in the examples. In the example it has shown only till a second level nested tabs. However in my application i need a third and fouth level ajax nested tabs. Can anyone please go through the link and give me an insight as how to create a third level nested ajax tabs. Any help will be greatly appreciated.

Thank you.

MODERTATOR'S EDIT - CONTENT BELOW MOVED FROM ANOTHER THREAD

I tried the same thing (http://www.dynamicdrive.com/forums/showthread.php?26638-Need-help-with-nested-ajax-tabs-Please) but it wont work at all...i am posting my codes can anyone tell me what have i done wrong here....

<!-- Main Page -->

<ul id="countrytabs" class="shadetabs">
<li><a href="external1.htm" rel="countrycontainer" class="selected">Tab 1</a></li>
<li><a href="external2.htm" rel="countrycontainer">Tab 2</a></li>
<li><a href="externalnested.htm" rel="countrycontainer">Tab 3</a></li>
</ul>

<div id="countrydivcontainer" style="border:1px solid gray; width:700px; height:400px; 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()

countries.onajaxpageload=function(pageurl){
if (pageurl.indexOf("externalnested.htm")!=-1){
var provinces=new ddajaxtabs("provincetabs", "provincedivcontainer")
provinces.setpersist(true)
provinces.setselectedClassTarget("link") //"link" or "linkparent"
provinces.init()
}

else if (pageurl.indexOf("newexternalnested.htm")!=-1){
var provinces=new ddajaxtabs("protabs", "prodivcontainer")
provinces.setpersist(true)
provinces.setselectedClassTarget("link") //"link" or "linkparent"
provinces.init()
}

}
</script>
<!-- External Nested Page -->

<ul id="provincetabs" class="shadetabs">
<li><a href="external1.htm" rel="provincedivcontainer">Tab 1</a></li>
<li><a href="external2.htm" rel="provincedivcontainer">Tab 2</a></li>
<li><a href="newexternalnested.htm" rel="provincedivcontainer">Tab 3</a></li>
</ul>

<div id="provincedivcontainer" style="padding: 10px; border-top: 1px solid gray;">
</div>
<!-- New External Nested Page-->

<ul id="protabs" class="shadetabs">
<li><a href="external1.htm" rel="prodivcontainer">Tab 1</a></li>
<li><a href="external2.htm" rel="prodivcontainer">Tab 2</a></li>
<li><a href="external3.htm" rel="prodivcontainer">Tab 3</a></li>
</ul>

<div id="prodivcontainer" style="padding: 10px; border-top: 1px solid gray;">
</div>

sandesh
04-03-2015, 04:16 AM
common guys, ain't here anyone who can solve this problem of mine. I think the problem is with that else if statement, i know i am missing something very important, it will be kind of you guys if you point out that mistake of mine.