Results 1 to 3 of 3

Thread: Ajax Tabs Content Script (v 2.2) Using External Html with Javascripts

  1. #1
    Join Date
    Sep 2010
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Ajax Tabs Content Script (v 2.2) Using External Html with Javascripts

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

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...axtabscontent/

    3) Describe problem:

    I am a newbie. When I load content from external html containing javascript, the javascript does not execute. I created a simple test page displaying the date in a box (div). When I load this into the tab content div, it displays the box (div) but, not the date (javascript). I have more complicated javascripts in the external html pages that do not show either. Is there a way to execute the javascript in external pages?

  2. #2
    Join Date
    Sep 2007
    Location
    The Netherlands
    Posts
    1,881
    Thanks
    49
    Thanked 266 Times in 258 Posts
    Blog Entries
    56

    Default

    That's because the script uses innerHTML to include external content.
    If you put the javascript of the external files in the head of the main page (demo.htm, in this case), then the javascript will execute.
    ===
    Arie Molendijk.

  3. #3
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Yes, that's true. You may also need to initialize imported content before it will work with the scripts Arie has correctly instructed you put on the 'top' page.

    To do that the Ajax Tabs script has an optional onajaxpageload property that you can configure if necessary to initialize newly arrived content, example using a typical init:

    Code:
    var countries=new ddajaxtabs("countrytabs", "submain_gallery")
    countries.setpersist(true)
    countries.setselectedClassTarget("link") //"link" or "linkparent"
    countries.onajaxpageload = function(pageurl){
    	$("a[rel=example_group]").fancybox({
    		'transitionIn'	: 'elastic',
    		'transitionOut'	: 'elastic',
    		'titlePosition' : 'over',
    		'titleFormat'	: function(title, currentArray, currentIndex, currentOpts) {
    			return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' &nbsp; ' + title : '') + '</span>';
    		}
    	});
    };
    countries.init()
    In the above, the highlighted is initializing fancybox. You may replace that highlighted code with whatever is required (if anything) to initialize your imported content. Notice the red pageurl argument. It's not required in the above example. It contains a reference to the url of the page that was loaded. This can be helpful in some cases. For more information, see:

    http://www.dynamicdrive.com/dynamici...uppliment3.htm
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

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
  •