You are viewing limited content. For full access, please sign in.

Question

Question

Dynamically loading external JavaScript file.

asked on February 17, 2015

Hi,

I moved my Javascript code from within the LF Designer to external files.

Now I am looking for a way to load my External .js files on the page and stick a reference them in the HEAD section of the page   .I tried to use the following code but I is not working :

 

function loadjscssfile(filename, filetype){
    if (filetype=="js"){ //if filename is a external JavaScript file
        var fileref=document.createElement('script')
        fileref.setAttribute("type","text/javascript")
        fileref.setAttribute("src", filename)
    }
    else if (filetype=="css"){ //if filename is an external CSS file
        var fileref=document.createElement("link")
        fileref.setAttribute("rel", "stylesheet")
        fileref.setAttribute("type", "text/css")
        fileref.setAttribute("href", filename)
    }
    if (typeof fileref!="undefined")
        document.getElementsByTagName("head")[0].appendChild(fileref)
}
 
loadjscssfile("https://......../????.js", "js") 

 
Appreciate for suggestion .
 

Thanks.

 

0 0

Replies

replied on April 30, 2015

Hey Reza:

After testing the loadjscssfile function you provided, this function works well.

You can try the following ways to figure out why it doesn't work on your form:

1. when you use relative path for the reference tag, make sure the file does exist under the same root.

For example: if you use <script src="/MARCH/MYExternal.js"></script>, the real src will be: http://YOUR-SERVICE/MARCH/MYExternal.js. If the file doesn't exist, an error 404 (not found) will occur.

Notice: In JavaScript, when you add <script> element with src attribute into <head>, the website will ALWAYS try to load the file.

(1). within the loadjscssfile function, if the src is invalid, this reference tag won't be added into <head>.

(2). if you still want to add the reference tag into <head> whether the src is valid or not, you can use the following function:

function directAddRefTag(filename, filetype){
  if(filetype=='js')
	$("head").append("<script type='text\/javascript' src='"+filename+"'><\/script>");
  else if(filetype=='css')
    $("head").append("<link rel='stylesheet' type='text\/css' href='"+filename+"'>");
}

After running this function, the reference tag will be added into <head> element as a child. If the src is invalid, the error 404 will occur. To avoid unnecessary error, we suggest you to always pass in a valid src.

 

2. make sure your file is under the same http or https with your server.

if your external JavaScript file is in http while your server is in https, the load request will be blocked.

 

3. I am not sure how you call this function.

(1). if you want to run the function when you first open the form, you can use the following code:

$(document).ready(function(){
    loadjscssfile("MARCH\/MYExternal.js","js");
})

(2). If you want to call this function by clicking a button, you can use the following code:

$(document).ready(function(){
  $('button').on('click', function(){
      loadjscssfile("MARCH\/MYExternal.js","js");
  }); 
})

You can also call this function by triggering other events.

 

Hope the above methods can solve your problem. Let me know if it works or not. :)

2 0
replied on February 17, 2015

What product are we talking about here? Forms? Web Access? WebLink?

0 0
replied on February 18, 2015

I am talking about Forms.

0 0
replied on February 18, 2015

Hi Reza, we may need more detailed code to troubleshoot your problem. Thanks! 

0 0
replied on February 18, 2015

Hi Reza, also you can try this $.getScript (which is much easier) first see if that would work for you http://api.jquery.com/jquery.getscript/ , and make sure you're using the same http and https 

0 0
replied on February 19, 2015

Thanks for your answer .

$.getScript() is used to load a external Java Script file from the server to get HTTP request . But I am supposed to call

I am not supposed to get any data .

I want to include a JavaScript  refrence  tag dynamically in the page . For example :

<script src="/MARCH/MYExternal.js"></script>

 

Thanks.
 

 

 

 

0 0
replied on April 29, 2015

Did you ever find out how to do this? Or if it's possible?

0 0
You are not allowed to follow up in this post.

Sign in to reply to this post.