Question

The goal is to load script-Tags per ajax, execute the scripts and show the content of the script-tag (a iframe with a video).

The scenario:
The scenario is a video page. If i click on “video-text” the id in the dom will be determined. After that an ajax-php-request will be executed with the determined id. This request will responese with a script tag. And this is the problem: How can i get the iframe?
Have anyone a tip for me?

ajax-call:

$.ajax({
    type: "GET",
    url: "/get-embed-by-id/"+$(this).find('.views-field-nid .field-content').html(),
    success: postToPageTwo,
    error : postToPageTwo,
    datataype: "html",
});

This call returns a script like this one

<script type="text/javascript" src="http://exampleurl.de/video/7"></script>

The content of this script is for example:

(function(){ 
    document.write('<iframe id="video_11" class="mediacube_video" 
     src="http://exampleurl.de/video/11.html?" scrolling="no" 
     align="center" frameborder="0" framespacing="0" width="725" height="409">
     </iframe>');
})()

EDIT
the code to use with $.getScript:

$.getScript("http://exampleurl.de/video/5", scriptResponse);

and the code of scriptResponse:

function scriptResponse(data) {
  console.log("data:");
  console.log(data);
}

but the data is always undefined. or did i anything wrong?

Answer 1

jQuery has .getScript() to load and execute scripts for you. no need to call an ajax to return an html to load another script (that’s a lot of round trips) just to call a script.

$.getScript('http://exampleurl.de/video/7');

---

if the initial request really matters (maybe some parsing on the back-end to determine the link of the script), you can have the initial response return just the url of the script. then use that returned string for the .getScript()

$.get('initial_url',function(returned_url){
    $.getScript(returned_url);
});

but still, too many round trips.