I have a div tag which is filled with script via an ajax call, but the script does not execute.
Is there a way to cause the script to execute?
5 Answers
If you use jQuery's .html method it parses out the script tag and evals it:
$("div").html('<script type="text/javascript">alert("This should work")</script>');
If jQuery isn't an option you could write this yourself using either (1) a regular expression, or (2) parse out the DOM tree and find script tags. (#2 is how jQuery does it)
2 Comments
Ian Vink
jQuery though needs to be triggered and if I included this in the payload that is sent back to the client it won't run as ajax downloaded script does not start. Exception: I can set the defer tag in the script markup and IE will run it, but that is only x% of the users.
Ikke
This is also the reason why script tags within AJAX requests don't end up in the place they are in the html from the response.
It is always a good idea to separate content from code. Load content via AJAX and code by inserting <script> tags. If you are using jQuery, use $.getScript() to load scripts dynamically.
Comments
I guess, you are writing script tag into innerHTML directly
This will not work.
document.body.innerHTML+="<script>alert(1)</scr"+"ipt>";
you have to write using DOM functions like this
var tag = document.createElement("script");
tag.innerHTML="alert(1)";
document.body.appendChild(tag); //can be append to any object other than body
or Better use jQuery
3 Comments
Ian Vink
The problem is that the script is included in the Ajax payload and sent to the client inside the DIV. I can't get script to start once it arrives at the client so there is a chicken and egg problem.
YOU
Hi, in Ajax return, what kind of result? just javascript codes? or include script tag? If just javascript codes, you can
eval or if include script tag, you can use above example in my post and change document.body with your div tag, and append there.YOU
and could you update your post with more information, like your web site and more explanations? because people will notice and they will also can find out your current problem, rgds
If you set innerHtml of div, the script tags should execute. I am using $("#divid").load() to load dynamic contents and script tags do execute.
Try using JQuery if it does not work out using plain javascript.
1 Comment
Ian Vink
Sadly that isnt the case. Script in the html payload of an Ajax delivered payload to the client is not executed.
make a callback after ajax load completes like:
function load_scripts(element_id) {
if (!document.getElementById) return;
var elmt = document.getElementById(element_id);
if (!elmt) return;
var scripts = elmt.getElementsByTagName('script');
if (!scripts) return;
var file = null;
var fileref = null;
for (var i = 0; i < scripts.length; i++) {
file = scripts[i].getAttribute('src');
if (file) {
fileref = document.createElement('script');
fileref.setAttribute('type', 'text/javascript');
fileref.setAttribute('src', file);
document.getElementsByTagName('head').item(0).appendChild(fileref);
} else {
eval(scripts[i].innerHTML);
}
}
}
ScriptManager.RegisterClientScriptBlock. The framework sends them down specially forevaling on the client upon insertion into the DOM.