Okay I have a js file in htdocs and when I include it in my php page it doesn't work however when I load it from online it works I don't know what is wrong with it.
I have:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title> test</title>
</head>
I am putting the js file at the bottom of the page and this doesn't work,
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="js/boostrap.js"></script>
<script type="text/javascript" src="js/wpts_slider_multiple.js"></script>
This works,
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="http://www.jqueryslidershock.com/wp-content/plugins/tsslider/js/boostrap.js"></script>
<script type="text/javascript" src="http://www.jqueryslidershock.com/wp-content/plugins/tsslider/js/wpts_slider_multiple.js"></script>
try this: src="/js/boostrap.js"> instead of src="js/boostrap.js">
the / is your root path
you can use this absolute path /js/boostrap.js in php, js, css files, and it works fine.
<script type="text/javascript" src="/js/boostrap.js"></script>
<script type="text/javascript" src="/js/wpts_slider_multiple.js"></script>
You should give full path of your jquery files like
http://example.com/js/boostrap.js
Code
<script src="http://example.com/js/boostrap.js"></script>
<script src="http://example.com/js/wpts_slider_multiple.js"></script>
Either of the following is happening.
Incorrect path - Please check the file paths.
No Read permission for the JS files - If you are sure that the path for the local JS files are correct, check their read permissions.
File does not exist - Simple reason as it states. I believe that it's not the case.
Let me know what you found.
try giving the paths like
<script type="text/javascript" src="/js/boostrap.js"></script>
<script type="text/javascript" src="/js/wpts_slider_multiple.js"></script>
src='/js/boostrap.js'
Assuming your root is http://localhost then the above link should always resolve to http://localhost/ProjectName/js/boostrap.js whether it's called from
http://localhost/ProjectName/index.php or http://localhost/ProjectName/subdir/index.php
Make sure the js files are present within your folder structures
Always try to give relative paths to your files so that they can be easily found.
Related
Basic html page. Just starting and downloading packages. Checking if my Semantic UI setup is properly installed, but when I open up my index.html page and check the console I get 'GET file:///semantic/dist/semantic.min.css net::ERR_FILE_NOT_FOUND', along with 'GET file:///semantic/dist/semantic.min.js net::ERR_FILE_NOT_FOUND'. Which is strange!
These are my script tags within my head tag inside my index.html file:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>HTML5 boilerplate – all you really need…</title>
<!-- You MUST include jQuery before Fomantic -->
<script src="https://cdn.jsdelivr.net/npm/jquery#3.3.1/dist/jquery.min.js"></script>
<link
rel="stylesheet"
type="text/css"
href="/semantic/dist/semantic.min.css"
/>
<script src="/semantic/dist/semantic.min.js"></script>
</head>
<body id="home">
<h1>HTML5 boilerplate</h1>
</body>
</html>
I can click on the relative paths in both tags and it will take me to the actual file in my editor.
My current folder structure is:
Semantic
dist
semantic.min.css
semantic.min.js
index.html
What gives?
Try ./semantic/dist/semantic.min.css
How do I pass the JSP variable to javascript function in external file?
I have the following set up
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script type="text/javascript" src="js/jquery/jquery-2.1.1.js"></script>
<script type="text/javascript" src="js/jquery/ui/jquery-ui.js"></script>
<script type="text/javascript" src="js/date/moment.js"></script>
<script type="text/javascript" src="js/app.js"></script>
<script type="text/javascript" charset="utf-8" src="js/d3.js"></script>
<script type="text/javascript" src="js/myScript.js" ></script>
<link href="js/jquery/ui/jquery-ui.css" rel="stylesheet" />
<link href="js/jquery/ui/jquery-ui.theme.css" rel="stylesheet" />
<link href="css/myCSS.css" rel="stylesheet" />
<title>My Title</title>
</head>
<body>
<div id="myDIV">
<c:set var="myVar" value="${myInVar}" />
<script>runMyScript();</script>
</div>
</body>
</html>
Now inside my javascript, I try to access the jsp variable but neither of the two ways I found online works:
var javaScriptVar = '${myVar}';
var javaScriptVar2 = "<%=myVar%>";
Instead of the actual value of the jsp variables, I get the strings.
I read in this answer: Passing variable from JSP to Javascript which suggest to declare the variables before I include the javascript file, but I can't figure out how to do that.
If I put them in the header, they are not resolved because they come from a backend request.
If I don't include the script in the header and add src attribute to the script section before making the call, the method is never executed.
Totally confused here.
Your JavaScript is inside a .js file. The server will (exceptional circumstances aside) treat that as a static file. It will just serve it up to the client without processing.
If you want to run JSP code (such as <%=myVar%>) then put it in a JSP file.
This is the index.html with angular-alpha35:
<html>
<head>
<meta charset="UTF-8">
<base href="/">
<title>APP Ang2</title>
<script src="scripts/traceur-runtime.js"></script>
<script src="https://jspm.io/system#0.16.js"></script>
<script src="scripts/bundle35/angular2.dev.js"></script>
<script src="scripts/bundle35/router.dev.js"></script>
<meta name="viewport" content="width=device-width,initial-scale=1" />
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>
<app>Loading...</app>
<script>System.import('app').catch(console.log.bind(console));</script>
</body>
</html>
And it works fine if there is internet connection and system.js can be loaded. If I try to get a local copy of system.js like this:
<script src="scripts/system#0.16.11.js"></script>
then nothing works until I put rx.js in the root folder and put this line at the end of the file:
<script src="scripts/es6-module-loader#0.16.6.js"></script>
</body>
</html>
then System.js works fine, but in this case, there is a strange problem with angular2 bindings. they are not working until I do some interaction with the page (submit a form, open a select, make some div change its dimensions even with simple hidden, etc..). As soon as something changes on the page, all bindings get to work and the page gets resurrected.
How to make all this work locally without node.js and without internet connection?
You should include the sfx version of angular 2 like this:
<script src="https://code.angularjs.org/2.0.0-alpha.32/angular2.sfx.dev.js"></script>
Note that it's a self contained js file you can download locally.
Check this sample project I made in github:
https://github.com/alfonso-presa/angular2-es5-sample
Edit: Check this SO question for more clarification on what sfx means: Difference between angular.dev.js and angular.sfx.dev.js
Thanks to Arnaud Boeglin's idea of difference in packages' version, I checked with es6-module-loder and by chance this installation works perfectly (so far I didn't find any problem):
<script src="scripts/traceur-runtime.js"></script>
<script src="scripts/es6-module-loader.js"></script>
<script src="scripts/system#0.16.11.js"></script>
<script src="scripts/bundle35/angular2.dev.js"></script>
<script src="scripts/bundle35/router.dev.js"></script>
The es6-module-loader has to be before the systemjs in <head> tag.
I was trying to use Dygraphs in web application. Please see below simple code.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7; IE=EmulateIE9">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>MyHtml.html</title>
<!--[if IE]>
<script type="text/javascript" src="/js/excanvas.js"></script>
<![endif]-->
<script type="text/javascript" src="/js/rgbcolor.js"></script>
<script type="text/javascript" src="http://dygraphs.com/dygraph-combined.js"></script>
<script type="text/javascript" src="/js/dygraph-combined.js"></script>
<script type="text/javascript" src="/js/dygraph.js"></script>
<script type="text/javascript" src="/js/CanvasRenderingContext2D.js"></script>
</head>
<body>
<div id="graphdiv"></div>
<script type="text/javascript">
g = new Dygraph(
document.getElementById("graphdiv"), "Date,Temperature\n" + "2008-05-07,75\n" + "2008-05-08,70\n" + "2008-05-09,80\n");
</script>
</body>
</html>
If i include the line
type="text/javascript" src="http://dygraphs.com/dygraph-combined.js"
with the scripts it works fine in firefox and chrome and it wont work in IE, it gives error like 'CanvasRenderingContext2D' is undefined. If i download the dygraph-combined.js and include it in my web application and access it by giving path, it wont work in all three browsers, it gives an error message Dygraph not defined. Please help me. I want to know why this is happening.
You should only need to include dygraph-combined.js, whether from your website or your own site. Did you include excanvas.js on your site? This could explain why it's not working in IE8.
The problem might be that scripts which are in /js/... are not accessible for any of your browser.
It explains why in the case you refer to remote dygraph-combined.js, only IE doesn't work - it needs excanvas.js referenced from /js/...
In the case you downloaded dygraph-combined.js and replace the remote reference to /js/... then no browser works as they can't access the /js/dygraph-combined.js
Check accessibility of /js/dygraph-combined.js and /js/excanvas.js. Should there be the reference without leading slash e.g.: js/dygraph-combined.js?
And as previously mentioned, remove all other script references (except dygraph-combined and excanvas.js). Dygraph-combined already contains everything in one file and excanvas is needed for IE.
In a web page I am developing, I am trying to include two javascript files. the code looks like this:
<head>
<meta http-equiv="pragma" content="no-cache"/>
<meta http-equiv="expires" content="0"/>
<meta http-equiv="cache-control" content="no-cache"/>
<link rel="stylesheet" type="text/css" media="all" href="/configaudit-portlet/css/dynamicJSTable/gridtable.css" />
<link rel="stylesheet" type="text/css" media="all" href="/viper-theme/css/universal_buttons.css" />
<script type="text/javascript" src="/configaudit-portlet/js/dynamicJSTable/configaudit_gridtable.js"></script>
<script type="text/javascript" src="/configaudit-portlet/js/dynamicJSTable/configaudit_gridtable_nextPrevious.js"></script>
<script type="text/javascript>
function blah(){
.
.
.
The files are suppose to add additional formatting to tables that are loaded onto the page. I have used these files in the past on different pages with no problem at. I can load the jsp that creates the table with the files included with no problems. Nothing in the file has change only the file/path names which I have checked over and over and nothing seems to be wrong.
Does anyone have any idea why this is happening?
Are your files located at the root of your domain? The way you have it right now, the files will be searched for at the root. If you remove the leading '/''s in your src definitions, they will be relative urls and files will be searched for in the same directory as your .html file.
All I can say is there is definately something wrong with your path to the js files.
What do you mean when you say that you checked over the paths?
Figure out your correct path of the js files, as you are saying that you changed the file/path names.
End quote is missing in the inline block: <script type="text/javascript">
Have you tried:
<script type="text/javascript" src="/js/dynamicJSTable/configaudit_gridtable.js"></script>
<script type="text/javascript" src="/js/dynamicJSTable/configaudit_gridtable_nextPrevious.js"></script>
Or maybe, on the top of the page
<%#taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
And something like this:
<script type="text/javascript" src="<c:url value="/js/dynamicJSTable/configaudit_gridtable.js"/>"></script>
<script type="text/javascript" src="<c:url value="/js/dynamicJSTable/configaudit_gridtable_nextPrevious.js"/>"></script>