The following code is a simple jsp page....save it as call.jsp
<%@page contentType="text/html"%>
<!-- The above is the page directive with attribute "contentType" which is used to get the content type of the page -->
<%@page pageEncoding="UTF-8"%>
<!-- The above is the page directive with the attribute "pageEncoding" tells us that we are working with unicode encoding within the page -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<!-- We call a ajax.js javascript which makes an asynchronous request to the server -->
<script language="javascript" src="ajax.js"></script> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>JSP Page using AJAX
</title>
</head>
<body>
<a onclick="sendRequest('GET','index.jsp')"href="#">ServerDate Time:
</a>
<div id="ajax_res">Server Date Time will replace thistext.
</div>
</body>
</html>
Now lets see the actual ajax.js script as given below. This is the actual ajax related script which is used to make asynchronous request to the server using the XMLHttpRequest object.
ajax.js
function createRequestObject(){
var req; try {
// Firefox, Opera, Safari
req = new XMLHttpRequest();
} catch (e) {
// Internet Explorer
try {
//For IE 6
req = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
//For IE 5
req = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {
alert('Your browser is not IE 5 or higher, or Firefox or Safari or Opera');
}
}
}
return req;
}
//Make the XMLHttpRequest Object
var http = createRequestObject();
function sendRequest(method, url){
if(method == 'get' method == 'GET'){
http.open(method,url,true);
http.onreadystatechange = handleResponse;
http.send(null);
}
}
function handleResponse(){
if(http.readyState == 4 && http.status == 200){
var response = http.responseText;
if(response){
document.getElementById("ajax_res").innerHTML = response;
}
}
}
Now lets see the code for index.jsp where we get the date from the server
index.jsp
<%=new java.util.Date()%>
With these three files ie ajax.js, call.jsp and index.jsp, we can use Ajax with JSP.
Enjoy Ajaxing!!!
Search the Web:
Sunday, December 16, 2007
Simple Example using AJAX-JSP
Subscribe to:
Post Comments (Atom)
19 comments:
I tried above example, but somehow i am not able to run it under IE7 or Firefox, not sure if i am doing anything wrong. please let me know, my email is jagdish22@yahoo.com
There is an error on the following line:
if(method == 'get' method == 'GET'){
should be:
if(method == 'get' || method == 'GET'){
Otherwise thanks, this got me started.
I tried above examples, But it not working...
Thanks you and Patrick. its working..
Why I am not getting the updated time when I click the link for he second time??
Thnks..it really worked out for me.....
im not getting the time when i click the link i just copied and the whole code and executed but not working
Hi,
I have three jsp pages.
in first jsp page i have one add button when this is clicked i made a call to ajax function
now the ajax is called and kept the contents in first jsp
now the contents which are added are one select list and textfield
now when i click the select list which was added again i have to call ajax and should keep the contents of third jsp..
is it possible to call ajax like this
pls reply me………
Hi,
I have three jsp pages.
in first jsp page i have one add button when this is clicked i made a call to ajax function
now the ajax is called and kept the contents in first jsp
now the contents which are added are one select list and textfield
now when i click the select list which was added again i have to call ajax and should keep the contents of third jsp..
is it possible to call ajax like this
pls reply me………
Hi,
I have three jsp pages.
in first jsp page i have one add button when this is clicked i made a call to ajax function
now the ajax is called and kept the contents in first jsp
now the contents which are added are one select list and textfield
now when i click the select list which was added again i have to call ajax and should keep the contents of third jsp..
is it possible to call ajax like this
pls reply me………
thanx for nice examples.....
send me some more examples ...
javaj2eethebest@gmail.com
anandpremkumara@cegonsoft.org
Thanks, Its working fine
hi i m suds- @ raj:-
u have to change some code in:-as follows call.jsp.
<a href="javascript:sendRequest()> ServerDate Time:</a>
this will work according to you.
Thanks this. It is working!
Dear all, when I click the link it does not update the time in page.
Please solve my problem.
I shall be thank full to everyone.
Such a nice post about the ajax. You explain in simple way to use ajax in web programming.
For better understand the ajax technology and it's implementation the read What is AJAX, learn AJAX (Asynchronous JavaScript and XML) and implement in webpage, where we can use AJAX
one of the best law college in India
Vidyasthali Law College in jaipur
one of the best law college in India
Vidyasthali Law College in jaipur
Thanks for sharing this unique information with us. Your post is really awesome. Your blog is really helpful
for me..
organic oil
organic oil in jaipur
organic cold pressed oils
ayurvedic oil store in jaipur
Post a Comment