Question

Im trying to load the twitter widget api in my ajax loaded page.

I have tryed to load the script in a couple of different ways and Im getting the alert to run each time but not the script itself.

So the first time I load the page, then the script is working, but if I go back to the menu and back to this page, then it doesnt load it?

This is the ajax loaded page.

<div id="twitterwid">

<a class="twitter-timeline" width="320" height="500" href="https://twitter.com/my account" data-widget-id="my widget id number">Loading tweets by @me</a>
<script>

alert("alert is working");

!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");


</script>

<div>

Any input appreciated, thanks.

Answer 1

All you have to do is: invoke a re-render of the widget tags on the page by calling:

twttr.widgets.load()

Similar question on Twitter Dev Channel

Note: inline script is not executed upon AJAX Load.
See: this SO Q&A for the solution to that.