dynamic reference to javascript file - javascript

I have a master page with a reference to javascript file that is js folder.
Both File and masterpage are in the root directory.
Many of my forms are in different folders Like
Root>first>abc.aspx
Root>second>def.aspx
Root>second>anotherFolder>def.aspx
I kept the reference like this
<script type="text/javascript" src="js/Check.js"></script>
I also tried src="<%= Page.ResolveUrl("~/js/Check.js") %>" and src="~/js/Check.js". While using Page.ResolveUrl and Server.ResolveUrl page shows error.
What i need to do so that any form in any directory get the reference of the file.
I dont want to do ../ and ../../ in every form.

<script type="text/javascript" src="/js/Check.js"></script>
you can use "/" --> web site root

If you're running your Visual Studio's internal server for debugging then firstly remove the virtual folder it insists on using.
Do this by selecting the root of your site in VS Solution explorer, then right-click and choose "Properties Window" - in the properties change "Virtual Path" from your "AppName" to /
This virtual path plays havoc with all sorts of paths..I find that if i don't make this change in VS then when I DO get all my paths working they won't work when I put the site on a live server that isn't using a virtual site.
Then set your JS reference to <script type="text/javascript" src="/js/Check.js"></script> - using the root / in your src.
UPDATE
If you really want to keep the virtual folder then you can try this - using ResolveClientUrl():
First, add Runat="Server" to your <head>
<head runat="server" id="myhead">
<script type="text/javascript" src='<%=ResolveClientUrl("~/js/check.js") %>' />

Related

My js array wont display with console.log in chrome browser

console.log doesn't display what I want it to show in my chrome browser dev console.
I have this code:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script src="script.js">
console.log(amazingCars);
var amazingCars =["BMW","Lexus","Ford","Mercedes"];
amazingCars.pop();
console.log(amazingCars);
amazingCars.sort();
console.log(amazingCars);
amazingCars.length;
console.log(amazingCars.length);
</script>
</body>
</html>
The directions for the assignment are the following:
Link the JavaScript page to the HTML page.
Create an array named amazingCars that contains four values:
BMW
Lexus
Ford
Mercedes
Remove the last value from the array
Next, sort the array in alphabetical order
Lastly, find the length of the array
I dont understand why it isn't displaying or the reason of this issue
If you are putting your JS code in html just add them between<script></script> tag.
You do not need to add src for script unless your JavaScript code is coming from a separate script file.
The src attribute specifies the URL of an external script file.
If you want to run the same JavaScript on several pages in a web site,
you should create an external JavaScript file, instead of writing the
same script over and over again. Save the script file with a .js
extension, and then refer to it using the src attribute in the
<script> tag
.
As per the instructions that you are following : "Link the JavaScript page to the HTML page."
Create another file "index.js" in your project directory.
Move your js code into the index.js file in your project directory and then use :
<script src="index.js"></script> in your HTML.
Firstly, make the <script src="index.js"></script> seperate from the code in the head, also unless if you have a seperate javascript file you dont need the src part at all, and secondly the first console.log outputs it before definition, creating an error. I hope this helped
You have to change <script src="script.js"> to <script>.
Alternatively you can keep it this way and create a script.js file and copy paste all the code you have inside the <script> tag to the file. This file need to be in the same folder as your index.html file.

Error at loading Slider Revolution 5.0 Extrensions

I downloaded a template and open it directly, it gives me an error for the slider.
!! Error at loading Slider Revolution 5.0 Extrensions.
Local Filesystem Detected !
Put this to your header:
<script type="text/javascript" src="js/vendor/revslider/public/assets/js/extensions/revolution.extension.slideanims.min.js"></script>
<script type="text/javascript" src="js/vendor/revslider/public/assets/js/extensions/revolution.extension.layeranimation.min.js"></script>
<script type="text/javascript" src="js/vendor/revslider/public/assets/js/extensions/revolution.extension.kenburn.min.js"></script>
<script type="text/javascript" src="js/vendor/revslider/public/assets/js/extensions/revolution.extension.navigation.min.js"></script>
Again I uploaded to local server, there is no error but an empty slider.
I checked the inspect element, it shows the errors in the below image:
Looks like you're trying to get those files from a folder, js, in your source folder; that's not where they are located. With a quick Google search I found that those were located on another website, http://iccila.com.br.
The fixed <script> tags:
<script type="text/javascript"
src="http://www.iccila.com.br/js/plugins/revslider/public/assets/js/extensions/revolution.extension.slideanims.min.js">
</script>
<script type="text/javascript"
src="http://www.iccila.com.br/js/plugins/revslider/public/assets/js/extensions/revolution.extension.layeranimation.min.js">
</script>
<script type="text/javascript"
src="http://www.iccila.com.br/js/plugins/revslider/public/assets/js/extensions/revolution.extension.kenburn.min.js>
</script>
<script type="text/javascript"
src="http://www.iccila.com.br/js/plugins/revslider/public/assets/js/extensions/revolution.extension.navigation.min.js">
</script>
It is a cause of jQuery conflict. First I recommended upgrading your revolution slider.
Step to fix:
Go to bakend and click Slider Revolution
Click Global Setting.
Click on buttons
Insert JavaScript Into Footer:
Defer JavaScript Loading:
Make sure revolution.extension.slideanims.min.js and other js files you are adding are in the folder js/vendor/revslider/public/assets/js/extensions/ and also that the js folder is in the same folder as this page that you are trying to open.
=======
If it isn't then specify the exact location in place of js/vendor/revslider/public/assets/js/extensions/
I had similar issues with Magento Rev Slider.
The problem was the caching extension that I have used. Amasty Full Page Cache.
I disabled and tried and everything worked fine.
So, I recommend you to check if all files exist with proper permission.
Then check and see if the page is cached.
Try and fully disable cache.
Also disable Chrome or browser Cache
It worked for me.
You also need to add this to your page revolution.extension.slideanims.min.js to your files.
I had the same exact problem I solved it by downloading this revolution.extension.slideanims.min.js file and then adding it to the folder
Then the mentioned code should be added at the bottom of the page.
Basically just look at your folder and see if all the mentioned js files exist. If they don't download them and add it manually.
You need server Environment to run Rev slider in local pc.
Like put all files in local host or upload in web server.
It will work.
Thanks

Locally sourcing Javascript in HTML

Extreme beginner here guys so please explain as easily as possible.
I've read multiple variations of this and still am unable to figure it out, any help is greatly appreciated.
What I am wanting is a local environment to be able to learn HTML & javascript, but cannot get the script source inside HTML to correctly reference the .js file sitting in the exact same folder as the .html file. I am testing in a Chrome browser just referencing the .html file on my local machine via file:///C:/JavaScript/Index.html.
2 files(index.html and JS.js), both located locally on C:\Javascript
HTML Code:
<!doctype html>
<head>
<title>Title in browser tab</title>
</head>
<body>
"Text on the page"
<script src="C:\JavaScript\JS.js"></script>
</body>
</html>
-Based on what I read, if they are in the same folder I should be able to just reference <Script src="JS.js"> as there is no folder structure to look through, is that correct?
-I've also tried to absolute path via <script src="file:///C:/JavaScript/JS.js"> and related versions of <Script src="C:\Javascript\JS.js"> that do not work either.
In my JS.js file, I have nothing but alert(); to test functionality, as my reasoning for incorrect sourcing.
If I simply write <script>alert();</script> without referencing any outside source, the alert works as planned.
Thank you in advance!
I'd recommend popping open Chrome's Developer Tools to see where the issue may lie (and, if you're new to development, these are tools that are built into Chrome that will make your life so much easier).
Your assumption about not requiring a path should be correct: if you're referencing another file that lives in the same directory, omitting a full path will cause the browser to assume the path is relative (e.g. "right next to") to the current file:
<!doctype html>
<head>
<title>Title in browser tab</title>
</head>
<body>
"Text on the page"
<script src="JS.js"></script>
</body>
</html>

How to include js file from shared location in sharepoint master page

I would like to include js file from different location that it's now.
Currently in master page code it looks as below:
<SharePoint:ScriptLink ID="ScriptLink1" language="javascript" name="Company/Scripts/myJsfile.js" Localizable="false" runat="server"/>
and it works fine.
But what I'd like to do is to change current location of this javascript file. Target location of this .js file is a shared location (" \\v-share\share\javascript ").
Is there any way to include this .js file from shared location in sharepoint master page ?
You could try this :
<script type="text/javascript" src="\\serverip\path\to\jsfile" ></script>

Where do I store files for the src method?

I am learning JavaScript and there is this:
<script type="text/javascript" src="myjava.js">
</script>
Where would I store "myjava.js"? Would it find it if the file is on my desktop?
You should put the javascript file in the same folder your html file is residing. I highly discourage the use of absolute path to specify the src since you will have to edit the references once you move your file from one place to another. Also, a good organization is necessary while writing web apps so I recomment you to create a proper directory structure such as:
webroot
yourpage.html
js
myjava.js
css
styles.css
images
1.jpg
With such directory organization, your work looks properly structured. So now you can reference the javascript file as <script type="text/javascript" src="./js/myjava.js"> </script>
For static html pages, the JavaScript file must be in the same folder as the html file, from which it is called. Otherwise you should use a relative path - ../path/somefolder/myjava.js or full path.
Example:
<script type="text/javascript" src="C:/Documents%20and%20Settings/USER/Desktop/some.js"></script>
The value value of the src attribute of a <script> element is the URL to a script file. This URL can be relative or absolute.
If the page containing the <script> element is located at, for example, http://mysite.net/someDir/myPage.htm, and the script file is in the same directory, you can use any of the following for your src attribute.
<script src="myscript.js"></script>
<script src="/someDir/myscript.js"></script>
<script src="//mysite.net/someDir/myscript.js"></script>
<script src="http://mysite.net/someDir/myscript.js"></script>
If you are loading the page from your computer, save the script file in the same directory as your html file, and use a relative path.

Categories

Resources