Share on Google+Share on Google+

Showing content of a file using JSP & jQuery

Advertisement
In this tutorial , we will discuss how to display text ,saved in a text file using JSP & jQuery.

Showing content of a file using JSP & jQuery

In this tutorial , we will discuss how to display text ,saved in a text file using JSP & jQuery. In this example, the content of the text file is fetched and display on the browser. The html file contains a text area and a button. On clicking button, jQuery requests JSP for text saved in text file ,which it will display in the text area provided.

Code for the html file(jqDisplaycontent.html) :

<head>
<title>Show Content</title>
<script type="text/javascript" src="jquery-1.4.2.js">
</script>

<script type="text/javascript"
function contentDisp()
{
$.ajax({
url : "includetxt.jsp",
success : function (data) {
$("#contentArea").html(data);
}
});
}
</script> 
</head>
<body>
<table width="100%" border=0>
<tr><td>&nbsp;</td><td>&nbsp;</td></tr>
<tr><td>&nbsp;</td><td>&nbsp;</td></tr>
<tr><td width="30%" >&nbsp;</td>
<td style=
"color:blue;" width="70%">
Click below button to display content of the file
</td></tr>

<tr><td>&nbsp;</td><td ><input type="button" 
value=
"Click" onClick="contentDisp();">&nbsp;
<span style=
"color:blue;"></span></td></tr>

<tr><td>&nbsp;</td><td>
<textarea id="contentArea" rows="10" cols="50"></textarea>
</td>
</tr>
</table>
</body>
</html>

JSP Code(includetxt.jsp)

<%page import="java.io.*" %>
<%
  BufferedReader input = new BufferedReader(new FileReader
(
"C://rose.txt"));
String line = "";
while ((line = input.readLine()) != null)
{

out.println(line);
}
input.close();
%> 

Content of the text file (rose.txt):

Welcome to RoseIndia.Net
jQuery Tutorial Learn how you can do a lot of work with small code.
jQuery is here to help us in achieving high result with less coding.
jQuery is great!!!!

OUTPUT :

After clicking button :

Download Source Code

Advertisements

Advertisement

Posted on: July 26, 2010 If you enjoyed this post then why not add us on Google+? Add us to your Circles

Share this Tutorial Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.