Showing content of a 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 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>

Here is the video of “How to get server side content using jQuery and display on page?”:

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 :

Click Download Source Code

Download Source Code

Ads