This is my file under WEB-INF/jsp folders:
<%# page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!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">
<title>jQuery Hello World</title>
<script type="text/javascript" src="/WEB-INF/static/jquery-1.4.2.js"></script>
</head>
<script type="text/javascript">
$(document).ready(function(){
$("#flag").html("Hello World !! I have come from J Query World");
});
</script>
<body>
<font color="RED"> Hello World !! I have come from plain world</font>
<font color="BLUE"> <div id="flag"></div></font>
</body>
</html>
and my jquery file is under WEB-INF/static
what should i do so that my code works properly , i think path of .js file is causing the prob.
WEB-INF is where you keep private files for your application that should not be accessible to the client.
Move your JS to somewhere accessible.
The question is where is your jsp file.
As you said your jsp's path is : WEB-INF/jsp
So your js path should be this: src="../static/jquery-1.4.2.js"
Try this and i believe it will work.
If it will not then try src="../WEB-INF/static/jquery-1.4.2.js", otherwise add a comment with your new state.
Related
I'm new to JQuery and developing a mavenized dynamic web application with eclipse. I downloded JQuery and put the folder under webcontent and refering to it with src tag.
Below is the code snippet:
<%# page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!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">
<title>Insert title here</title>
<script type="text/javascript" src="/app/jquery-3.2.1.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#hh").hide;
alert("OK");
});
</script>
</head>
<body>
<input type="button" id="hh" value="here">
</body>
</html>
However I don't see the outcome on the server.
Make sure the reference path to the file (src) is correct and that you have permissions to read it.
Try this,
Created a test.js file, only with this line of code alert("this
work!");
Put the test.js in your folder App, same place when you
have your jquery.js
Make the reference in your code <script
type="text/javascript" src="/app/test.js"></script>
If you can see the alert("this work!") now you know that your reference is ok, if you do not see, something you are doing wrong.
I want to know why for 404 errors of a js or css or images the container/application server doesn't display a error page in the browser configured in the web.xml. Also how to know which file caused the 404 error in the error page configured in web.xml. I need to invalidate the user session in the error page but i want to know which type of file or which file caused the 404 error.
My Web.xml looks like this
<?xml version="1.0" encoding="UTF-8"?>
<web-app id="WebApp_ID" version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
<welcome-file-list>
<welcome-file>page1.jsp</welcome-file>
</welcome-file-list>
<error-page>
<error-code>404</error-code>
<location>/page2.jsp</location>
</error-page>
</web-app>
page1.jsp :-
<%# page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!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">
<title>Insert title here</title>
<script type="text/javascript" src="abc.js"></script>
</head>
<body>
<%
System.out.println("page 1");
%>
</body>
</html>
In this sample application abc.js does not exist.
page2.jsp:-
<%# page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!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">
<title>Insert title here</title>
</head>
<body>
<%
System.out.println("page 2");
System.out.println(request.getRequestURI());
%>
</body>
</html>
The output i get is :-
page 2
/Test404/page2.jsp
I want to know why page 1 was not printed in the console.
Also i want to know which file (in this case abc.js) caused the page2.jsp to run.
Any help would be much appreciated.
Thanks
I use Xenu to find these. Try it, you'll like it!
I need to use Handlebars inside of a jsp page. I have handlebars-v1.3.0.js in my js folder and used the following code snippet to include that js file into my jsp page.
code:
<script type="text/javascript" src="./js/handlebars-v1.3.0.js"></script>
I tried <script type="text/javascript" src="js/handlebars-v1.3.0.js"></script> also. But no luck.
But when the page is loaded I am getting an error "Hanldebars not defined" in my browser console. Please suggest what am I doing wrong.The whole thing is working if I use handlebars inside of an html page.
Folder structure is as shown below.
-WebContent
--Home.jsp
-js
--handlebars-v1.3.0.js
I would like to know two things.
1.) what is the right way to give the js file path inside the jsp file ?
2.) Does jsp support handlebars ?
'components' is an array object which is defined in another js.
My source code(Home.jsp) :
<%# page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!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">
<title>My first JSP</title>
<script type="text/javascript" src="./js/handlebars-v1.3.0.js"></script>
<script type="text/javascript">
Handlebars.registerHelper('eachByIdx', function(menuData, options) {
// My Logic
});
var menuSource = document.getElementById("myTemplate").innerHTML;
var menuTemplate = Handlebars.compile(menuSource);
document.getElementById("div1").innerHTML = menuTemplate(menuData);
</script>
</head>
<body>
<form action="Hello" method="post">
<input type="text" value="ajith" />
<script id="myTemplate" type="text/x-handlebars-template">
<table>
{{#eachByIdx components}}
// My Logic here
{{/eachByIdx}}
<tr>
<td>
Add New
</td>
</tr>
</table>
</script>
</form>
</body>
</html>
Don't use a relative path to load JS files from within JSP files, since JSP files can be:
Located essentially anywhere, and
May be used (e.g., included) in other places
Instead, use an absolute path relative to your web content root, ideally using a JSP URL-ish tag so the context is provided automatically.
Regarding absolute path , try ${pageContext.request.contextPath}/js/handlebars-v1.3.0.js
Yes , please move your scripts code to the bottom, you are trying use getElementById , but the page did not finish loading.
Please see below sample:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script src="${pageContext.request.contextPath}/js/handlebars-v1.3.0.js"></script>
</head>
<body>
<form action="Hello" method="post">
<input type="text" value="ajith" />
<div id="div1"></div>
</form>
<script id="myTemplate" type="text/x-handlebars-template">
<table>
{{#eachByIdx components}}
// My Logic here
{{/eachByIdx}}
<tr>
<td>
Add New
</td>
</tr>
</table>
</script>
<script type="text/javascript">
Handlebars.registerHelper('eachByIdx', function(menuData, options) {
//My Logic
});
var menuSource = document.getElementById("myTemplate").innerHTML;
var menuTemplate = Handlebars.compile(menuSource);
document.getElementById("div1").innerHTML = menuTemplate(menuTemplate);
</script>
</body>
</html>
I've recently ran into a problem and I would really use a bit of help from the community. I'm trying to load a HTML file using jQuery load().
The index file:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Question</title>
<meta http-equiv="Content-Type" Content="text/html; charset=euc-kr" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
function restart(){
$("#wrap").load('new-content.html').hide().fadeIn('slow');
}
</script>
</head>
<body>
<div id="wrap">
<div id="content">Text before restart: 남성</div>
</div>
<br />
Restart
</body>
</html>
The new HTML file includes some simple HTML content and a call to a .js file (used for some animations). The new content file:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Question</title>
<meta http-equiv="Content-Type" Content="text/html; charset=euc-kr" />
<script src="main.js" language="javascript" type="text/javascript" />
</head>
<body>
<div id="contentInner">Text after restart: 여성</div>
</body>
</html>
As you can see I've included the correct encoding charsets (for both files) and I've double checked and I can confirm that every file used for this part of the code it's encoded as "KOREAN" (checked in different apps like Dreamweaver, Notepad++, Sublime Text 2).
Yet still once I load the content the characters are not encoded properly; question marks appearing instead of characters.
Of course I made some searching before posting and I found a few helpful topics about this called the PHP header solution, but this isn't an options since it need to use HTML/JS/CSS only.
The same behavior occurs when I'm using the Japanese language too. In other latin based languages everything is working perfectly fine of course.
Any sort of input/advice/help would be much much appreciated.
Thank you!
I'm trying to carry out a jsp page with some functionalities of Jquery. But, despite my efforts, there's no way to do it.
I've downloaded jquery1.7.1 and jquery-ui1.8.17 (non-mini), and renamed it to jquery171.js and jquery-ui.js. They are in /js folder.
There's a very simple jsp page below, which is not showing the DatePicker of jquery. I'm using jquery UI 1.7.1. There's no errors in the files, just several warnings, like variables never used and not initialized.
<%# page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!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">
<%# taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<link type="text/css" href="css/ui-lightness/jquery.css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery.js"/></script>
<script type="text/javascript" src="js/jquery-ui.js"/></script>
</head>
<body>
<input type="text" id="tx" name="tx"/>
<script type="text/javascript">
$("tx").datepicker({dateFormat: 'dd/mm/yyyy'});
</script>
</body>
</html>
But, when I run the stuff, nothing happens. Have you any idea of where should be the problem? If you have already configured jquery in your Eclipse, what other steps have you did? Thanks in advance.
You are missing #.
Try $("#tx").datepicker({dateFormat: 'dd/mm/yy'});
Also use yy instead of yyyy.
y means year (two digit)
yy means year (four digit).
Check this link for more options.