How to append script tag dynamically in asp.net user control?

Question

I have user control (myUserControl.ascx). in that i am trying to append script tag and assigning "src" dynamically and then checking onload and onerror events, but it seem to be not working.I am calling PerformDynamicJS on button click.

function PerformDynamicJS(){
var scriptGoogle = document.createElement("script");
scriptGoogle.type = "text/javascript";
scriptGoogle.src = "myscript.js";
scriptGoogle.onload = function (evt) {
            alert('Inside onload');
        }
 scriptGoogle.onerror = function (evt) {
            alert('Inside on error');
        }
}

stackoverflow.com/questions/4117712/…

Neha
– Neha

2012-02-09 09:44:10 +00:00
Commented Feb 9, 2012 at 9:44 — Neha
– Neha, Commented Feb 9, 2012 at 9:44

volpav · Accepted Answer · 2012-02-09 09:30:29Z

1

Add your newly created tag to the document:

document.getElementsByTagName('head')[0].appendChild(scriptGoogle);

answered Feb 9, 2012 at 9:30

volpav

5,12821 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Vaibhav Chawale Over a year ago

I cannot get my head tag , as it is not present in my user control. It is present in my master page.

volpav Over a year ago

Doesn't matter if it's a user control or not. You have access to entire document from within your JavaScript function "PerformDynamicJS". If you don't have a <head> section on your page then use "document.body" instead of "document.getElementsByTagName(...)".

score 1 · Accepted Answer · 2012-02-09 11:16:50Z

var script = document.createElement("script");
script.setAttribute("type", "text/javascript");
script.setAttribute("src", "url to the script file here");
document.getElementsByTagName("head")[0].appendChild(script);

I looked for "onload" with scripts before, I don't remember finding such event. I ended up writing a timer-based js code to frequently check for an object that is expected to be defined in the script that is being downloaded. So, it's either that you do that, or: why not simply not do anything from within the code that inserted the script tag - instead, you have a perfectly timed moment when your script is ready: add "unwrapped" code to the script itself (e.g. alert("I, the script, loaded and I'm ready with these functions that I provide");.

And, there is no "on error" case here: the script will either download or it will not (for whatever reason: unavailability, connectivity, server-error, etc). If it does [download], any errors that may be occurring while that script is being executed/used are not really transport-related (those errors should be treated the same way you treat any other script error), so your intention with "onerror" here isn't a fit (IMO). +1 :)

EDIT: If it doesn't download, then it will not execute, and you will not be able to use it. If your client code is really waiting, then you'll have to write some kind of timer-based timeout logic; for example, after the "add to head" line above, do something like this:

window.setTimeout(function()
{
    // object/variable "newScriptObject" is defined in the new script
    if(!newScript)
    {
        // script timed out; let's proceed with plan B
    }
    else
    {
        // script ready, proceed as planned;
        // although, like I said, I think it's more precise if you execute this code in your myscript.js instead - as maybe that code will be ready before the 5 sec assumed here
        // alternatively, use window.setInterval to check for objects defined this script every so milliseconds, in which case, when you find the script, don't forget to stop that timer (window.clearInterval)
    }
}, 5000); // wait 5 sec for the new script

Finally, there is no such thing as "partial download" in this context. A sane browser will not start executing a script that hasn't been fully, not only downloaded, but also parsed (interpreted). The "interpreted" part is why you'll see JS errors that often point to unrelated location when you miss a brace somewhere or due to other syntax errors. Missing a brace, at least, is in this category, as such syntax error practically "shifts" (kind of) code blocks completely, making it impossible to figure out what's what. Sorry for going a little bit off-topic here.

Collectives™ on Stack Overflow

How to append script tag dynamically in asp.net user control?

2 Answers 2

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related