PDA

View Full Version : Ajax Tabs not refreshing external Javascript



mgbinetti
08-26-2007, 08:53 PM
1) Script Title: Ajax Tabs Content script

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

3) Describe problem:

I love the Ajax Tabs Content Script.

However, I have javascript files that pertain to the external HTML documents that are to be loaded into the content area.

I've tired loading the .js files in the header of the tabs content parent page and I've tried using the suggested method of importing the scripts associated with the external HTML files using the rev="javascript.js" in the tabbed link itself.

The javascript only loads the first time - when the parent page is loaded, but when the user clicks on the tabs the javascript does not load/refresh.

The source code can be seen here: http://www.krumbsmovie.com
Click on the Media page. This page has a "photos" tab and a "posters" tab linking to external HTML content that is useless without the .js loading along with them.

I'm a newbie so I can't describe the issue very well, but I feel that if I could just have the "photo" and "poster" links refresh the entire "Media" page when clicked this would solve the problem since clicking on the Media page reloads the Javascript just fine. So close!

Thanks in advance.

- Matt

ddadmin
08-27-2007, 01:23 AM
In cases where the JavaScript within the external page is executed on run time, using Ajax to fetch it won't work. What you can do is first create a blank HTML page (ie: externalpage.htm), then inside it, create a <iframe> tag that calls the desired external page with the dynamic content: (ie: dynamic.htm). Something like:


<iframe src="dynamic.htm" style="margin:0; padding:0; width:100&#37;; height: 100%"></iframe>

Then inside the Ajax Tabs script, have one of the tabs call externalpage.htm.

mgbinetti
08-28-2007, 12:59 PM
Thanks, that definitely worked. I guess I was trying to avoid using an iFrame, but that did the trick.

So what type of javascripts can be passed through the tabbed links if not runtime scripts?

Also, I noticed on another script's demo on dd.com: Dynamic Ajax Content; http://www.dynamicdrive.com/dynamicindex17/ajaxcontent.htm that nothing happens when I click on the tab: Load CSS & JS files
Load "style.css" and "tooltip.js"

I'm running an PowerBook G4 Titanium, OS X.4, Firefox 2.0.0.6. I'm checking the demo of this script on dd.com to be clear.

Seems to be the same problem. Now I'm wondering if it is just my 'puter that can't recognize the scripts being called during run time?

Anyway, thanks for your quick help.

jscheuer1
08-28-2007, 04:48 PM
Seems to be the same problem.

But it isn't. The added style and script on:

http://www.dynamicdrive.com/dynamicindex17/ajaxcontent.htm

will work in most browsers. I have the same version of FF that you do, but for the PC. It works in that.

The reason that they will is that they require no initialization. With scripts requiring initialization, the best approach is to place the script(s) on the 'top page', and then to find some way of initializing them that is appropriate to the content being added, and to the script(s) involved.

This varies by script, except (as you discovered) if you use the iframe method suggested by ddadmin.

And, in the case of that content scroller you are using, doing it without iframe may require a rewrite of the script, something like putting the script generated markup on the external page and removing the code from the script that generates it. You would still need to initialize it at an appropriate point each time the content is fetched though.

mgbinetti
08-28-2007, 11:14 PM
Thank you all. Most illuminating.

Best,

Matt