Ajax Tab Linked Content within DIV

**bielen** · 01-05-2009, 06:58 PM

1) Script Title: Ajax Tabs Content Script 2.2

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

3) Describe problem:

I've been trying to get this working with no success.

I have a series of tabs which load in a div called "ajaxcontentarea". I want to have active links within the content area open and update the same div. However, when clicked, I am directed to a new page?

I've tried all the instances and suggestions and cannot get it to work. I prefer not to use IFRAMES because of printing issues.

Any info is appreciated.

Thanks

**Snookerman** · 01-05-2009, 07:10 PM

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

**Nile** · 01-05-2009, 07:10 PM

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

Please include your code so that we can take a look at it, we can't do much without it.

Can we please see a link to your page and the code - that would be helpful.

Edit:
Snookerman got there before me.

**bielen** · 01-06-2009, 01:40 PM

Here's some sample code. It's on an internal site so a link is not available. Any info is appreciated.

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<title>Tab Test</title>
<link rel="stylesheet" type="text/css" href="ajaxtabs/ajaxtabs.css" />
<script type="text/javascript" src="ajaxtabs/ajaxtabs.js">
/***********************************************
* Ajax Tabs Content script v2.2- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
</script>
<script type="text/javascript" src="js/alternate_rows.js"></script>
</head><body>
<div id="outerWrapper">
<div id="header"></div>
<div id="topNavigation"></div>
<div id="contentWrapper">
<ul id="hometab" class="shadetabs">
  <li><a href="tab_overview.asp?hometab=0&pid=7&editor=" rel="ajaxcontentarea">Overview</a></li>
  <li><a href="tab_schedule.asp?hometab=1&pid=7&editor=" rel="ajaxcontentarea">Schedule</a></li>
  <li><a href="tab_scope.asp?hometab=2&pid=7&editor=" rel="ajaxcontentarea">Scope</a></li>
  <li><a href="tab_costs.asp?hometab=3&pid=7&editor=" rel="ajaxcontentarea">Costs</a></li>
  <li><a href="tab_issues.asp?hometab=4&pid=7&editor=" rel="ajaxcontentarea">Issues</a></li>
  <li><a href="tab_risks.asp?hometab=5&pid=7&editor=" rel="ajaxcontentarea">Risks</a></li>
</ul>
<div id="ajaxcontentarea" style="border:1px solid gray; width:904px; margin-bottom: 1em; padding: 10px">
  <p>Content goes here.</p>
</div>
<script type="text/javascript">
var maintabs=new ddajaxtabs("hometab", "ajaxcontentarea")
maintabs.setpersist(true)
maintabs.setselectedClassTarget("link") //"link" or "linkparent"
maintabs.init()
</script>
</html>
</div>
</div>
<div id="footer">Footer</div>
</div>
</body>

**bielen** · 01-06-2009, 06:21 PM

Anyone have any suggestions once the code was psoted?

**ddadmin** · 01-06-2009, 11:31 PM

I want to have active links within the content area open and update the same div. However, when clicked, I am directed to a new page?

That question is basically answered on this page. But instead of a link like the below to select the 3rd tab of an Ajax Tabs Content instanced called "countries:

Code:

<p><a href="javascript:countries.expandit(2)">Select 3rd Tab</a></p>

Since you want the link within the content area itself (which could be an IFRAME), the link should be modified to:

Code:

<p><a href="javascript:parent.countries.expandit(2)">Select 3rd Tab</a></p>

Thread: Ajax Tab Linked Content within DIV

Thread Tools

Search Thread

Ajax Tab Linked Content within DIV

Sample Code

Bookmarks

Bookmarks

Posting Permissions