Run
Run

Reputation: 57206

Addthis and Asynchronous Loading

Following the guide, I can initiate addthis via ajax but it only works in one place,

for instance,

html index page 'index.php',

<a href="#" class="load">click to load</a> 

<div id="container"></div>

<p>addthis at the footer,</p>
<div class="addthis_toolbox addthis_default_style left addthis" style="border:0px solid #000; margin:20px 5px 0px 10px; width:300px;">
<a class="addthis_button_facebook_like" addthis:url="#" addthis:title="#" addthis:description="#" fb:like:layout="button_count" style="width:80px;"></a>
<a class="addthis_button_tweet" addthis:url="#>" addthis:title="#" addthis:description="#" style="width:100px;"></a>
<a class="addthis_button_google_plusone" g:plusone:size="medium" style="width:65px;"></a>
</div>

I have another addthis buttons in the ajax page - 'load.php',

<p>it should have another addthis in this ajax loaded page,</p>

<a class="addthis_button_facebook" addthis:url="#" addthis:title="title" addthis:description="" href="http://www.addthis.com/bookmark.php?v=250&amp;username=lauthiamkok"></a>
<a class="addthis_button_twitter" addthis:url="#" addthis:title="title" addthis:description="" href="http://www.addthis.com/bookmark.php?v=250&amp;username=lauthiamkok"></a>
<a class="addthis_button_google_plusone" addthis:url="#" addthis:title="title" addthis:description="" href="http://www.addthis.com/bookmark.php?v=250&amp;username=lauthiamkok"></a>

This is my jquery,

 $(document).ready(function(){

            // the addthis buttons are loaded successfully here.
                    initAddThis();

            $('.load').click(function(){
                $('#container').load('load.php', function(){

                    // the addthis buttons fail to load here.
                    initAddThis();

                });
                return false;
            });

        });

        function initAddThis() 
        {
            addthis.init()
        }

It only happens on the index page but not the ajax page... how can I fix this?

Upvotes: 1

Views: 5372

Answers (3)

TUNER88
TUNER88

Reputation: 923

Try this

var addthis_url = "http://s7.addthis.com/js/250/addthis_widget.js#pubid=your_id";
if (window.addthis) {
    window.addthis = null;
    window._adr = null;
    window._atc = null;
    window._atd = null;
    window._ate = null;
    window._atr = null;
    window._atw = null
}
$.getScript(addthis_url)

Upvotes: 0

Paolo Cavanna
Paolo Cavanna

Reputation: 1

You need to move your initAddthis function to window.onload method, so the function will be triggered when all the assets of the page are loaded.

window.onload = function(){
    initAddthis();
}

Upvotes: 0

Manuel van Rijn
Manuel van Rijn

Reputation: 10305

You're using the wrong example code :) The code you posted is used to init the addThis after you've loaded everything with ajax.

You are looking for a way to update/init some links with addthis.

Think this will help you out: Rendering with JavaScript

Upvotes: 1

Related Questions