Failed to load resource: server responded with status of 404. Cannot load js files - javascript

I am trying to use jqxGrid. I am trying to link to the js files. Here is the structure of the project
Main Project
src
(below within src folder)
index.html
jqwidgets folder
Within the index.html I have links to the js as such
<script src="jqwidgets/jqxcore.js"></script>
<script src="jqwidgets/jqxdraw.js"></script>
<script src="jqwidgets/jqxbargauge.js"></script>
Here is some documentation
Angular components doc
Also a demo of what I want to achieve
demo
Any help is appreciated!

Related

Spring Boot Web with Thymeleaf: HTML template can't find the given JS file

I just set up a very basic Spring Boot Web Application with Thymeleaf, but I can't access my external JS file from the corresponding HTML file of my template and can't figure out why.
My resource folder structure is as follows:
static/
index.html
css/
graph.css
js/
createGraph.js
templates/
visualizeGraph.html
Within my visualizeGraph.html I try to call the createGraph.js using following snippet within the <body> element:
<script th:src="#{/js/createGraph.js}" type="text/javascript" >
</script>
In the <head> element of visualizeGraph.html, I added my stylesheet using following snippet:
<link rel="stylesheet" type="text/css" media="all"
href="/css/graph.css" th:href="#{/css/graph.css}" />
My Spring Boot Web Container runs on Port :8082, so I access my webapplication from localhost:8082 and access the visualizeGraph template from localhost:8082/visualizeGraph
When I check the Developer Console (F12), it throws a 404 for the createGraph.js file, but not for the graph.css file -> it can find the css successfully.
I can even access the css through localhost:8082/css/graph.css but CAN'T access the js-file using localhost:8082/js/createGraph.js (throws a 404 - as expected)
I can't figure, what's the cause for this phenomenon as my application.properties also has no additional parameters for modifying the resource source folder etc.
Okay, this was VERY weird. I found the solution, but I am not sure, whether it's IntelliJ, which was responsible for this problem or something else.
What I did was to edit my <script> element in my HTML file to the following:
<script src="/js/createGraph.js" type="text/javascript" >
</script>
and my intention was solely to try out, whether it would change anything. Somehow, IntelliJ told me, that it was not able to find the path (neither the js folder, nor the createGraph.js file within it) so what it suggested was to create the folder and the file (so I did, using ALT+Enter). What I did afterwards is to just copy the content of my old createGraph.js to the new file and to delete the (very strangely the same named) old folder and file and voila, everything works as expected... Very weird.
You can call your JS files present in resources/static folder like below:
<script type="text/javascript" src="js/script.js"></script>
No need to give the forward slash before the js folder.
below I am attaching screenshot for my code:
Here, I was having images folder inside the static folder so we can directly call that folder.
If you have any further doubts please feel free to visit my github amisham96

JavaScript - Error 404 resource not found

I had a java script in my JSP, which worked fine. Now I want to move it to it's own file (abc.js). I created js-Folder and placed it there.
I tried to include it with <script language="JavaScript" type="text/javascript" src="./js/abc.js"></script> which links to http://localhost:8080/ProjectName/js/abc.js (from link in HTML-Code of the page). I think this should be correct, isn't it?
Nevertheless I get errors in the browser console (Failed to load resource: the server responded with a status of 404 () abc.js)
Do I have to register the .js somewhere to be recognized?
Edit: My project structure is like this:
ProjectName
|---WEB-INF
|---page.jsp (that wants to include abc.js)
|---js
|---abc.js
The WEB-INF directory is not publicly accessible. Your HTML file accesses the JS file over an public URL. Details see here: Include javascript file from inside WEB-INF
So the solution for your problem is to place the JS file on the same level as the WEB-INF directory, so that it is served publicly and adjust the src link accordingly:
<script type="text/javascript" src="${pageContext.request.contextPath}/js/abc.js"></script>
(How include an external JS file in a JSP page)

Not able to include js files in html file on standalone java application

Hi I am working on standalone java application running on some port number.
I am trying create UI with HTML where it includes some external js files.
I have included those files in header tag as below.
<script type="text/javascript" charset="utf-8" src="js/jquery.json-2.2.min.js"></script>
<script type="text/javascript" charset="utf-8">
But it always gives the error message as "Filed to load resource:the server responded with status code of 404.
Any ideas?
Seems like a pathing issue to me.
What is the relative location of your "js" directory from the calling page in your file system?

Plugins cannot find their css styles in folder

I've downloaded this template: http://themeforest.net/item/-medic-medical-health-and-hospital-html5-theme/8331329 from themeforest. Original template has /plugins/ folder in root folder. I moved this folder into /assets/plugins/ and included it in HTML like this example:
<script type="text/javascript" src="/assets/plugins/smooth-scroll.js"></script>
The javascript files are found, but plugins are still requesting their css files from original folder /plugins and not in /assets/plugins/, for example:
http://www.scsppza.local/plugins/royalslider/royalslider.css Failed to load resource: the server responded with a status of 404 (Not Found)
I can't found where is path to css files defined for those plugins. Is it possible to fix it somehow?
Open the assets/css/style.css file and change the #import urls!

why javascript library cannot be found when imported in html page deployed in Tomcat7?

I have a web service project in eclipse, and i deploy it to Tomcat by right clicking on the project and click on run on server. The following script tag is in one of the html pages:
<script type="text/javascript" src="../assests/js/lib/yui_3.6.0pr3/yui/build/yui/yui-min.js"></script>
The html page is located in folder called SamplePages which is contained in the folder TEST-WS/production, the folder assets is also in TEST-WS/production.
When i open this page in the browser, i get the following JS error:
GET http://localhost:8080/TEST-WS/production/assests/js/lib/yui_3.6.0pr3/yui/build/yui/yui-min.js 404 (Not Found)
The path TEST-WS/production/assests/js/lib/yui_3.6.0pr3/yui/build/yui/yui-min.js is correct and the .js file is there. I have other scripts like:
<script type="text/javascript" src="../assets/js/lib/all-concat.js"></script>
but it works fine. what could be the problem?
src="../assests/js
src="../assets/js
One of those paths is probably wrong.

Categories