Execute javascript that is loaded from ajax

Question

I am trying to create/change a javascript array based on what is return from an ajax call. This is what I am working with so far:

function ajaxCall(code) {
    xmlhttp=new XMLHttpRequest();
    xmlhttp.open("POST","ShowBusiness",false);
    xmlhttp.send(code);
    document.getElementById("content").innerHTML = xmlhttp.responseText;
}

and then within that response HTML I have (among other elements)

<script type="text/javascript">
    images = [1, 2, 3];
</script>

However, when I then try to use console.log(images); within a function that was in the original page, it tells me that "images is not defined". I then tried to go back and insert a var images = []; into the head of the original page, but then the console log returns [], not what I hope to change as a result of the ajax call.

Any ideas how I can get around this? I assume that the page is not recognizing the javascript that I am inserting into the page with ajax.

possible duplicate of [How to return the response from an asynchronous call?](http://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-asynchronous-call) — Mouser, Aug 10 '15 at 14:42

score 0 · Answer 1 · answered Aug 10 '15 at 14:44

0

Use appendChild() instead :

function ajaxCall(code) {
    xmlhttp=new XMLHttpRequest();
    xmlhttp.open("POST","ShowBusiness",false);
    xmlhttp.send(code);
    document.getElementById("content").appendChild(xmlhttp.responseText);
}

answered Aug 10 '15 at 14:44

Ajay Narain Mathur

5,326
2
20
32

score 0 · Answer 2 · edited May 23 '17 at 12:14

0

Don't think script tags get executed on insertion. Check the answers in this question (or the edit of the original question) for a couple of solutions:

Executing <script> elements inserted with .innerHTML

edited May 23 '17 at 12:14

Community

1
1

answered Aug 10 '15 at 14:48

cviejo

4,388
19
30

Execute javascript that is loaded from ajax

2 Answers2