I have around 45-50 unique javascripts that contain data to be used in a graph. I do not want to link every single one of them. Is there a way to create a single external reference tag and fill it with a string i create in the local java inside the HTML? That way it can update at my leisure and I don't have to external reference 50 unique scripts at any given time. Note this is not on a server strictly local only for now. Also, I have only been using javascript and HTML a couple of weeks so I am a novice.
I have tried to create a tag inside the script link such as:
<script id="builtstringreference"></script>
but it produces nothing.
I have built the string that references the external javascript but can not get it back to the external reference link.
What I have in HTML:
<script id="trial"></script>
What I have in local Javascript:
var txt1 = document.getElementById("Product").value;
var txt2 = document.getElementById("Reactor").value;
var trialchange = "../Lot Data Trial Folder/lotdata_"+txt1+"_"+txt2+".js"
document.getElementById("trial").innerHTML=trialchange;
window.alert(trialchange); //just for testing
window.alert(typeof(trialchange)); //just for testing
What I want it to look like after update:
<script src="an external j.s"></script>
That way the external j.s can be changed and updated at any time without preloading 50 external j.s
I expect that I can change the external file at any time by selecting new product combos from drop-down lists which update ```txt1 and txt2 which builds the new external reference string but I feel like it's not this easy.
use something like build and then destroy the script tag
function createjs(){
var script = document.createElement('script');
script.addEventListener('load', function(){ resolve(); });
script.id = 'id-scr1';
script.type = 'text/javascript';
script.src='assets/script.js'
document.head.appendChild(script);
}
createjs();
function removeJS(id){
document.getElementById( id ).remove();
}
removeJS('id-scr1');
Related
I was given a javascript line that calls a javascript file which is made by a company called walkme.
I have an app/assets/javascript/application.js file that calls all of my jquery that I am using for the site. for example it contains:
require feed
which calls feed.js when someone is on the feed page. I would like the walkme.js to also be called at the same time this code is called
I am looking for a way to add this <script ... code to a ruby site that uses slim and jquery.
<script type="text/javascript">(function() {var walkme = document.createElement('script'); walkme.type = 'text/javascript'; walkme.async = true; walkme.src = 'https://cdn.walkme.com/thewalkme.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(walkme, s); window._walkmeConfig = {smartLoad:true}; })();</script>
I have tried a blunt style of just making a walkme.js in the same place as the feed.js and putting that <script ... code in that file while adding the necessary require walkme code, but that seems to do nothing.
Some info:
Ruby on Rails
Ruby 2.1.7p400
ubuntu 14.04 LTS server
some files are named *.html.slim
As you may be able to tell, I did not make all the ruby code and am not an expert in ruby, javascript or jquery.
If this was just an html site, I think could just add the line of code to the header.
Mostly, Javascripts are called after the page has finished loading, since you want to manipulate the DOM, most likely.
So, you either don't want to call the script in the head of your document, unless you have a document.ready in the script.
To answer your question then, if you want the following script:
function(){
var walkme = document.createElement('script');
walkme.type = 'text/javascript';
walkme.async = true;
walkme.src = 'https://cdn.walkme.com/thewalkme.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(walkme, s);
window._walkmeConfig = {smartLoad:true};
};
to be available only on the feed page of your application,
You can make this function a named function, in a separate file (say feed.js.coffee for example) and call the function in your slim view page as follow:
//feed.js.coffee:
#feed = ->
walkme = document.createElement('script')
walkme.type = 'text/javascript'
walkme.async = true
walkme.src = 'https://cdn.walkme.com/thewalkme.js'
s = document.getElementsByTagName('script')[0]
s.parentNode.insertBefore walkme, s
window._walkmeConfig = smartLoad: true
return
and in your view:
/feed.html.slim:
...
your codes...
...
coffeeview:
feed
Hi I am completely new to Sharepoint and wiki pages. I manage to do few changes to wiki pages to have a feel of it. I noticed that every time i create a link to a document if the version changes i need to update the link manually by editing it. Is there any way to automate this process?
Eg: Docv1.0.doc is updated to Docv2.0
Thanks
When you change a document, you don't need to change the file name. SharePoint has versioning built in, so you can keep the file name the same.
That's the only solution actually, don't change the filename. Enable versioning on the library to be able to see previous versions.
Sharepoint site has several links to templates and documents that points to a shared server and these documents can be updated as new versions, so the links to this files needs to be updated automatically, in fact these links need to call some script for dynamically linking them to the latest files. (not sure if a better way of doing this without a script). Here is what I could manage to do, a better and other options to achieve will be appreciated.
I manage to get something working using webparts Content Editor and linking it to a file. Not sure if this the only/best approached for Sharepoint 2007
<script type="text/javascript">
function getLatestFile(){
var myObject;
var recent = "";
myObject = new ActiveXObject("Scripting.FileSystemObject");
var folderObj = myObject.GetFolder("C:\Test");
var fc = new Enumerator(folderObj.files);
for(var objEnum = new Enumerator(FileCollection); !objEnum.atEnd(); objEnum.moveNext()) {
If (recentFile = ""){
recentFile = file;
else if (file.DateLastModified > recentFile.DateLastModified){
recentFile = file;
}
}
}//for loop
alert("recentFile : " + recentFile);
var mylink = document.getElementById("myLink");
mylink.setAttribute("href", urlToFile);
mylink.click();
}
</script>
<P> </P><A id="myLink" onclick="getUrl();"> TestFile1 </A>
Content Type Editor
check above link for more on using content links to use JavaScript and HTML.
I am writing a third party javascript (my.js) that can be inserted in a HTML page using script tag. I want to achieve the following:
my.js gets loaded (which has a function myFunc(params))
myFunc() gets called with appropriate params (parameters can change)
putting my.js script in head is not an option
What is the best approach that I can use?
The problem is that you can't really pass parameters w/ just 1 script tag pointing to an external file, so you would have to get them from some element in the DOM:
The html:
<html>
<body>
<script src="my.js"></script>
<input id="params" type="hidden" value="'param1', 'param2', 'param3'" />
<div id="result"></div>
</body>
</html>
The javascript:
function myfunc() {
var doc = document,
params = doc.getElementById("params").value.split(","); // make an array of params
doc.getElementById("result").innerHTML = params.toString();
}
window.onload = myfunc;
Honestly though, this is a kludge. As mentioned before by Felix, you should probably just use 2 script tags -- One to get the external js file and one to call the function with the parameters you need.
You can pass parameters in via the query string and parse them out dynamically.
For example, your script tag becomes:
<script src="my.js?foo=bar"></script>
You can then get the value of the URL using:
var scripts = document.getElementsByTagName('script');
var url = scripts[ scripts.length - 1 ].getAttribute('src');
Because of the order JS is loaded by the browser, the last script on the page (while your script is executing during load) should always be your script.
Then you parse the query string. There are a bunch of questions on Stack Overflow dealing with that. Ex:
Parse query string in JavaScript
I am creating a webapp and I have been using tag in my JSPs to ensure that all my links (both to pages and to resources such as images/css) are always consistent from the root of the application, and not relative to my current location.
Some of the content I am creating using jQuery, for example, I am creating a HTML table by parsing a JSON object and using jquery.append() to insert it in to a div.
My question is, if I want to dynamically create a link using jquery how can I achieve a consistent URL regardless of the page being executed? I have tried just building the html with the tag in it, but no joy.
Thanks!
var baseURL = "/* Server-side JSP code that sets the base URL */";
$("<a />", { href: baseURL+"/my/resource/here.jsp" }); //Your proper link
Or you could do:
var baseURL = "http://"+location.host+"/my/base/url/";
//Which gives you something like http://mySite.com/my/base/url/
Get the root value of your webapp into a string using a jsp tag inside your javascript.
var root = < %=myRootVariable%> //This evaluates to http://www.myapp.com
var dynamicBit = "/foo/bar"
var dynamicLinkUrl = root + dynamicBit
var $newa = $("Hello, world");
$someJQElement.append($newa)
Hopefully none of this will occur in the global namespace. Just sayin'
Basically, everytime anybody does anything on this website, I need to retrieve a new javascript from the server (it is a complex math thing, and I am not concerned with speed).
I make the AJAX call, and stick it in the browser in a tag, like this:
getandplaceajax('id=showtotals','main'); // The first is the URL parameter, and the second is the ID of the <div> tag.
While I am doing this, I would like to re-write the java-script file, on the server, and then reload it. It is like this, in the tag.
<script type="text/javascript" src="randomfilename.js"></script>
After this I refresh my object thusly, by retreiving new XML data:
object1.loadXML("http://mywebsite/mydata.xml",
function(xml, url) {eventSource.loadXML(xml,url); });
How do I tell the browser to re-load the java-script file (force a re-load, on demand)?
I tried to interactively load the java-script into the portion of the page, but this is an iffy situation given that AJAX is asynchronous and unpredictable in the event chain.
And I am not doing page loads, so referencing the java-script with a unique number parameter (to prevent caching) isn't an option.
An extra $50 in the church offering plate next Sunday, in your name, for a solution.
Thanks in advance
Jeff
There is no need to make an Ajax call if you just need to load a JavaScript file. You can just append a new script tag to the page.
var scr = document.createElement("script");
scr.type="text/javascript";
scr.src="myFile.js";
document.body.appendChild(scr)
If you are calling the same file each time you need to force it to fetch the new file by adding a querystring value
scr.src="myFile.js?ts=" + new Date().getTime();
On the server you can request a php, servlet, .NET page, etc and have it return the JavaScript code. It does not have to be a js file. Just set the content type to be JavaScript and your browser will not care.
If you are not using any library, you can use what Facebook is doing
http://developers.facebook.com/docs/reference/javascript/
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
to load in a new script this way. You can also change the src of the script tag, to something like 'myfile.js?timestamp=' + (new Date()).getTime(), or you can return javascript with <script> tag around it and put it into a div or return javascript and eval them, similar to how RJS is handled.