Load a JSP File using JQuery in One Line


Here is how to load a JSP file using JQuery in a single line!. The following is a hello world JSP example which will be loaded on a button click using the JQuery. As you can see from the image, the paradigm, write less, do more. is exactly exemplified here.

Project structure

Folder: C:\Program Files\Apache Software Foundation\Tomcat 8.0\webapps\jq_jsp
jq_jsp
    |
    +-- index.html
    +-- hello.jsp

index.html

<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script>
// When the document is ready..
$(document).ready(function(){
// When any element with input tag is clicked
// execute the following function
$("input").click(function(){
// Get object of element with loadHere id
// And in it load the hello.jsp file!
$("#loadHere").load("hello.jsp");
});
});
</script>
<title>Load a JSP File in JQuery</title>
</head>
<body>
<input type="button" value="Get hello"/>
<div id="loadHere"/>
</body>
</html>

hello.jsp

<%
response.getWriter().println("Hello world!");
%>

The greatest appreciation you could give me is sharing this article. I would sincerely appreciate it :)

No comments: