I am getting problem in referencing Javascript file.
My all js files reside in my js folder:MyProject/Js/*.js
Now on my master page i am refering my file like this:
<script src="js/jquery-1.9.1.js"></script>
<script src="js/jquery-1.9.0.min.js" type="text/javascript"></script>
Error showing in console:
SyntaxError: expected expression, got '<'.
On searching i have found that this issue comes due to inappropriate referencing of js files so i have resolve this error by doing this:
<script src="../js/jquery-1.9.1.js"></script>
<script src="../js/jquery-1.9.0.min.js" type="text/javascript"></script>
This above solution works when my .aspx page would be like this:
MyProject/Admin/Abc.aspx //This will work
But problem will occur when any of my .aspx page would be like such:
MyProject/Admin/Subfolder/Abc.aspx // This will not work
My Abc.aspx page contains master page but now in this case this will not load my js files due to ../
So can anybody tell me whats the correct way to reference js files which will work in both the cases??
Note:I am referencing all js files in to my master page and my master page is in:
MyProject/MasterPage.Master
I think you can give a try:
1) Use Bundling to reduce the loading time (Your script will be shorter as well)
2) Use ~/ instead of ../ to make your script/code work even if you relocate the pages.
You can easily find the scripts and codes of jquery bundle if you create a new ASP.NET application in Visual Studio.
Related
I've read a similar question here, but can't seem to get around it in this case, so would appreciate any clarification. I have a page in php that runs several instances of JavaScript that work on cue on localhost. However one particular instance of JavaScript (that makes an arrow hide when it scrolls beyond 10px) does not run, but when i run the same from an html version of the same php page, the arrow action works as desired. Why is this the case? Here is the code of the page in jsfiddle (exactly the same is used for respective sections in the php page.)
To clarify i have added this bit of JavaScript in the following manner at the end (after footer, before body end) of the index.php file (along with other blocks of JavaScript which work as desired for their respective targets):
<script type="text/javascript">
$(window).scroll(function () {
if ($(this).scrollTop() > 10)
document.getElementById('arr_downpoint').style.visibility = 'hidden';
else
document.getElementById('arr_downpoint').style.visibility = 'visible';
});
</script>
I have added jquery as follows (and it works for all other instances on the php page except for the arrow):
<script type="text/javascript" src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
Lastly, there are no console errors. Would like to know why only this block of JavaScript isn't working from php, but works from HTML (while the other JavaScript instances work fine on both php and HTML), and how to find out what's wrong?
RESOLUTION: Just found that I'd erroneously added # while assigning arrowpoint id. That's why the script couldn't do anything with the arrowpoint, since <a> now had a # as part of its name. sorry about that careless oversight, for the time it may have taken to consider.
If you are trying to load the page directly from the file (your page url start with 'file://...') the problem is that the browser is trying to load jquery using the same protocol (file instead of http) because you didn't specify a protocol for the external files (the src attribute starts with '//', which mean something like "use the same protocol of the current page"). You can verify if this is the reason behind your problem, opening the browser console looking for errors like:
GET file://code.jquery.com/jquery-1.11.3.min.js net::ERR_FILE_NOT_FOUND
GET file://code.jquery.com/jquery-migrate-1.2.1.min.js net::ERR_FILE_NOT_FOUND
Uncaught ReferenceError: $ is not defined
To fix this problem, you should always run you html from a server (like Apache with PHP, as you already did) or you can write the external scripts url including the protocol (but this can cause other problems if you will run your page under https)
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
At the bottom of every page, I have a .php include that links to all my .js files.
<?php include 'Core/js.php';?>
Within this .php I have this code;
<script src="../js/jquery.min.js"></script>
<script src="../js/jquery.dropotron.min.js"></script>
<script src="../js/skel.min.js"></script>
<script src="../js/skel-layers.min.js"> </script>
<script src="../js/init.js"></script>
<script src="../js/slider.js"></script>
This works perfectly for my pages placed in my root folder, ie "index.php"
However, the pages that are located in folders, don't seem to call the javascript when I use the .php include such as;
<?php include '../../../Core/js.php';?>
Although, when I don't use the include funtion, and just paste the < script>, it calls it perfectly. This wouldn't be a huge problem for me, but it doesn't allow the mobile site to run properly.
The first pages such as "index.php" have the mobile navigation, whereas pages located in the folders and don't have the php include code, don't have the same user friendly navigation. If someone could help me fix this, that would be great!
I think your problem is about paths.
When you execute: <script src="../js/jquery.min.js"></script> in your browser, it looks at the URL and goes from there. Let's say you're in http://example.com/products/index.php. The browser will try to load the JS from http://example.com/products/../js/jquery.min.js, which is http://example.com/js/jquery.min.js.
To avoid this, you should use absolute paths, like:
<script src="/js/jquery.min.js"></script>
Then it will always try to load http://example.com/js/jquery.min.js independently from the current URL.
As for PHP includes, I would advise you to use absolute paths when including files. There are many strategies, like using $_SERVER['DOCUMENT_ROOT'], using dirname() functions, using a global variable with your includes path, etc.
Whatever you choose, your includes should look something like:
<?php include '/var/www/includes/Core/js.php'; ?>
I'm assuming your folder structure is something like this:
/
index.php
js
jquery.min.js
jquery.dropotron.min.js
skel.min.js
...
Core
js.php
content
some folder
HTML files
...
So if you are inside content -> some folder -> html file your js.php should reflect this:
<script src="../../js/jquery.min.js"></script>
as you could see the path changes and thats where your error comes from
Use the absolute path. Your absolute path is the actual location on the server. An easy way to find it is look at the path you're connecting to with ftp.
It might look something like this /home/username/public_html/Core/js.php
I am unable to call a javascript function as it says "Object Expected". I am using asp.net and this is being used on a standard aspx page with some usercontrols. One of the user controls called CookieControl calls a javascript method setandCheckCookie() on document.ready.i.e
$(document).ready(function() {
setandCheckCookie();
)};
In the head section on my aspx page I have reference the javascript file before I add the control:
<script src="CookiesControl/js/Cookie.js" type="text/javascript"></script>
<uc2:Cookie ID="Cookie1" runat="server" />
I've event tried adding the script reference on the user control itself but when I go to my aspx page I get the object expected error.
I don't believe its the control or the js file as both these are used elsewhere in the website and they work fine but something I'm doing is stopping the js file from being reference because in firebug and IE debugger I can't see the referenced js file.
Perhaps the path is incorrect but I have dragged the script from the solution explorer and visual studio isn't complaining about the path either.
So my question is: what could potentially stop my javascript file from being referenced.
Visual Studio complaining or not about a path is not always saying what you'll get in the browser. To check if the script is referenced ok, try to get the script file in the browser. For example, if you page is at http://yoursite/yourpage.aspx and your script reference in the html code (by View Source, not what you see in Visual Studio) is folder/scriptFile.js, put this address http://yoursite/folder/scriptFile.js and see if you get the file. If not, then it is not referenced ok.
To solve issues like that, put the full path after yoursite, like:
<script src="/ScriptVirtualFolder/CookiesControl/js/Cookie.js" type="text/javascript"></script>
where ScriptVirtualFolder is in your site root folder, and it is a virtual folder, means it is accessible by the browser in this path.
Also, you can use asp.net to resolve your path by using the ~ sign and runat='server'. For example:
<script src="~/ScriptServerFolder/CookiesControl/js/Cookie.js" type="text/javascript" runat="server"></script>
I have an HTML page generated by an objective-C application and I want to load and open it in a local directory (not in a web server). The javascripts jquery.js and jquery.plot.js are stored in the same directory before the page is loaded.
I made the HTML page by following closely the examples available on http://flot.googlecode.com/
The scripts are declared in the HTML page as follows :
<script src="jquery.js" language="javascript" type="text/javascript"></script>
<script src="jquery.flot.pack.js" language="javascript" type="text/javascript"></script>
When I open the page, the expected graph (generated by the scripts) doesn't show up and I have the following syntax error in the javascript console :
Uncaught SyntaxError: Unexpected token ILLEGAL
The script source in the javascript console is made of strange (chinese ?) ideograms which are obviously "unexpected token" if it is what the browser sees.
I have the same problem with Chrome, Firefox and Safari.
The problem is not systematic because sometimes, it works !.
I have made tests with files prepared manually and again it works sometimes only.
I have also copied the same file which didn't work in another directory where the jquery scripts were present and, surprise, it worked ! but not always...
I have exhausted all my ideas on this problem and your help will be very much appreciated
Did you copy the JavaScript from an external source? I know I have had problems when copying from JSFiddle for example. Try removing any whitespace and see if that will get rid of the illegal token error.
I just had this problem and it was because the server on which my javascript was being hosted wasn't configured to send the javascript file with the correct MIME type. See this question.
Instead of fixing my server, I just opted to use a CDN path from cdnjs.com:
//cdnjs.cloudflare.com/ajax/libs/flot/0.7/jquery.flot.min.js
I'm JavaScript newbie. What I'd like to be able to do is to call a function from .js file sitting in ASP.NET MVC project's scripts folder.
The function is:
function myfunction() {
alert("HELLO");
}
...and it resides in file brfix.js
On a viewpage I call it like this:
<script src="../../Scripts/brfix.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
myfuntion();
});
</script>
But the code doesn't work. However, if I place js-code directly onto the viewpage, it works, like this:
<script type="text/javascript">
$(document).ready(function() {
alert("HELLO");
});
</script>
How to call a file-based js function? Could some JavaScript-Big-Kahuna help me out? =)
If that code is pasted directly from your source code, you have a typo so that'd be why it doesn't work!
your function is called myfunction(), but you're calling myfuntion()
you should enable js errors in your browser when developing. You don't say which browser you're using. For IE it's in Tools - Options - Advanced. Uncheck the "disable script debugging" options. In firefox I'd use something like FireBug as Dror says, if memory serves there are things that appear in the event of a javascript error. If you are still having problems I would try installing Fiddler2 (in IE) and building a request for the js file and see what comes back.
Another option would be to put a debugger; call just before you call your function, you should then be able to step through the javascript.
It may be that the reference to the external file is wrong:
<script src="../../Scripts/brfix.js" type="text/javascript"></script>
Make sure the reference is correct.
You can try by using view source to see the actual location ../../Scripts/brfix.js gets translated to in the final page.
You can also try with FireBug of FireFox.
If your mvc site is the root site in iis you can start the script src with a slash to get to the scripts. otherwise you can use an asp:ScriptManager to include the scripts
As other posters have mentioned, there is a typo. However...
Check out the Url.Content() method for referencing your site content. (images, scripts, etc...) Using ../.. isn't reliable, especially if you have varying levels of depth in your URLs or your application lives in a subdirectory.
Here's a helper I use in most of my projects, for example:
public static string Script(this HtmlHelper Html, string url)
{
UrlHelper Url = new UrlHelper(new RequestContext(Html.ViewContext.HttpContext, Html.ViewContext.RouteData));
string html = "<script type=\"text/javascript\" src=\"{0}\"></script>";
return string.Format(html, Url.Content(url));
}
And here it is being called:
<%= Html.Script("~/public/js/blah.js") %>
I had the same problem and it turned out that I had a few js files that weren't being found. If your MVC project structure is the default VS setup and your View page is in Home for example, then I think below will find the file:
<script src="../Scripts/brfix.js" type="text/javascript"></script>
But even if that one is found other js files not being found caused my $(document).ready not to work. Check your page in Firefox's Firebug, if a file isn't found you will see html markup with a message saying a resource could not be found, located underneath the offending reference. Once I resolved all the js references then my $(document).ready worked.
Strangely VS was telling me it couldn't find the js files when the references were correct, and wasn't flagging the problem when the references were incorrect.