Addthis is Undefined when I use addthis, When I load page by Ajax

Question

I'm try to show 'addthis sharing' buttons when make ajax call. at the first call by ajax, buttons does not show, but when I reload whole page everything is OK, buttons is right place.

I searched a lots of fixes but no one works for me. one of them is addthis.toolbox(); or window.addthis but when I use word addthis insde JavaScript tag, browser debugger writes error 'addthis is undefined'.

please give me smart advice what's happen and how can I fix it ?

Code (it's a partial view which load from ajax Call):

<script type="text/javascript" src="http://s7.addthis.com/js/300/addthis_widget.js#pubid=ra-xxxxx" async="async"></script>

<div class="addthis_sharing_toolbox"></div>

<script>
 addthis.toolbox(); // addthis - is undefined
</script>

Answer 1

I have fixed this problem.

In my project I have 3 View level

1. _layout
2. View
3. _partialview

I had addthis Js reference and button's Div inside the _partialView.

But when I move Js reference to View and change Url(add - &async=1) it works fine and now 'addthis' - is defined (till here is undefined).

Hare is full example:

View:

    <script type="text/javascript" src="http://s7.addthis.com/js/300/addthis_widget.js#pubid=ra-'yourPubId'&async=1"></script>
//Some Code 

_partialView:

//Some Code 
<div class="addthis_sharing_toolbox"></div>

<script>
    $(function() {
        addthis.init(); 
        addthis.layers.refresh(); 
      });
</script>

Good luck, everyone can use this perfect plugin 'addthis' when you load page by Ajax.