Hi All,
I have designed a
jsp page and have written a javascript code using ajax so that the data submitted to the
servlet is sent through this script code.
The jsp page is responsible to display records. For example,
when the page is loaded it displays about 10 records. When i click the next button it does not communicate with the servlet to give me the next 10 records.
The problem is when i tried to
test with IE 6 the data gets retreived only once and for the next retreival it does not communicate with the respective servlet at all. With Firefox the same code works fine.
This is the code...
/**
* This function is used to perform ajax call
*
* url - url for request
* formNameOrIndex - either formName or formIndex
* namedTag - name of the tag is to be updated
*/
function retrieveURL(url,formNameOrIndex,namedTag) {
tagName = namedTag;
//get the (form based) params to push up as part of the get request
url=url+getFormAsString(formNameOrIndex);
//Do the Ajax call
if (window.XMLHttpRequest) { // Non-IE browsers
req = new XMLHttpRequest();
req.onreadystatechange = processStateChange;
try {
req.open("GET", url, true);
} catch (e) {
alert("Problem Communicating with Server\n"+e);
}
req.send(null);//if method=get
} else if (window.ActiveXObject) { // IE
req = new ActiveXObject("Microsoft.XMLHTTP");
req.onreadystatechange = processStateChange;
try {
req.open("GET", url, true);
} catch(e) {
alert("Problem Communicating with Server\n"+e);
}
req.send(null);
}
}
/**
* This function used to get reponse from given url when request
status is successful.
*/
function processStateChange() {
if (req.readyState == 4) { // Complete
if (req.status == 200) { // OK response
splitAndReplace(req.responseText);
} else {
alert("Problem with server response:\n " + req.statusText);
}//end if-else
}//end if
}
/**
* This function used to prepare form-bean
*/
function getFormAsString(formNameOrIndex){
//alert('getFormAsString');
//Setup the return
String returnString ="?";
//Get the form values
formElements=document.forms[formNameOrIndex].elements;
//loop through the array , building up the url
//in the form /strutsaction.do&name=value
for(var i=0;i<formElements.length;i++){
//we escape (encode) each value
if(i==0)
returnString=returnString+escape(formElements[i].name)+"="+escape(formElements[i].value);
else
returnString=returnString+"&"+escape(formElements[i].name)+"="+escape(formElements[i].value);
}
alert(returnString);
return returnString;
}
/**
* This function used to split response text into given tag and replace existing with new HTML tags.
*/
function splitAndReplace(responseText) {
//alert('splitAndReplace');
//split document into tag
splittedElements = responseText.split("</"+tagName+">");
//Process each element
for(var i=0;i < splittedElements.length;i++) {
//check that this begins with <tagName id=
//leave other-tag that having no attribute named id
if((tagPos = splittedElements[i].indexOf("<"+tagName +" id=")) >-1 ){
//remove everything before <tagName id=
if(tagPos > 0) {
subString = splittedElements[i].substring(tagPos);
splittedElements[i] = subString;
}//end if
//get the id of tag
//get the name - between the 1st and 2nd quote mark
startNamePos=splittedElements[i].indexOf('"')+1;
endNamePos=splittedElements[i].indexOf('"',startNamePos);
name=splittedElements[i].substring(startNamePos,endNamePos);
//get the content - everything after the first > mark
startContentPos=splittedElements[i].indexOf('>')+1;
content=splittedElements[i].substring(startContentPos);
//alert("name : " + name);
//alert("content : " + content);
//Now update the existing Document with this element
//check that this element exists in the document
if(document.getElementById(name)){
document.getElementById(name).innerHTML = content;
} else {
alert("Element:"+name+"not found in existing document");
}//end if-else
}//end if
}//end for
}
Thanks,
Paul