Home.... | log in.... | Pub my question! | Sign-up....
Java-index >> Enterprise & Remote Computing >> Web Tier APIs

Request and response using Ajax...

Hi' does anyone know how to get 2 or more response if using ajax? (let's say that it's more than 1 response).cos XMLHttpRequest only can retrieve for one response at time. does anyone know how to solve this?Thanks a lot....
[247 byte] By [hudoqa] at [2007-11-27 2:56:12]
«« CSV files
»» Specifying a number inside an int
# 1
what do you mean by "2 or more responses"?1) get a response2) deal with it3) rinse and repeat
georgemca at 2007-7-12 3:33:40 > top of Java-index,Enterprise & Remote Computing,Web Tier APIs...
# 2

what i mean like this, i have a multiply function in my jsp, code like this :

<%

String a = request.getParameter("a");

String b = request.getParameter("b");

total = ( (Integer.parseInt(a))*(Integer.parseInt(b)) );

out.println(total);

out.println("hello");

%>

it prints total and hello.

How to handle it in my javascript? ajax just handle the response with xmlHttp.responseText. So all the output are handle in only in xmlHttp.responseText). how to make my ajax can receive 2 output from server seperately?

Thanks...

Btw this is my ajax source :

<%@page contentType="text/html"%>

<%@page pageEncoding="UTF-8"%>

<html>

<head>

<title>Ajax Multiply Example</title>

<script language="Javascript">

xmlHttp = null;

function postRequest(strURL){

if(window.XMLHttpRequest){ // For Mozilla, Safari, ...

xmlHttp = new XMLHttpRequest();

}

else if(window.ActiveXObject){ // For Internet Explorer

xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");

}

xmlHttp.open('POST', strURL, true);

xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

xmlHttp.onreadystatechange = function(){

if (xmlHttp.readyState == 4){

//alert(xmlHttp.responseText);

updatepage(xmlHttp.responseText);

}

}

xmlHttp.send(strURL);

}

function updatepage(str){

//i don't know how to modify in this.can anyone help?

document.getElementById('result').value = str;

document.getElementById('helloField').value = str;

}

function callMultiply(){

var a = parseInt(document.f1.a.value);

var b = parseInt(document.f1.b.value);

var url = "multiply.jsp?a=" + a + "&b=" + b + "";

postRequest(url);

}

</script>

</head>

<body>

<h1 align="center"><font color="#000080">Ajax Example</font></h1>

<form name="f1">

<input name="a" id="a" value="">

<input name="b" id="b" value="">

<input name="result" type="text" id="result">

<input name="helloField" type="text" id="helloField">

<input type="button" value="Multiply" onClick="callMultiply()" name="showmultiply">

</form>

</body>

</html>

hudoqa at 2007-7-12 3:33:40 > top of Java-index,Enterprise & Remote Computing,Web Tier APIs...
# 3

Well my friend

you have to use send xml response in this case and parse it and then update it.

in the following case

<%

response.setContentType("text/xml");

StringBuffer sb = new StringBuffer();

String a = request.getParameter("a");

String b = request.getParameter("b");

total = ( (Integer.parseInt(a))*(Integer.parseInt(b)) );

sb.append("<?xml version="1.0"?>");

sb.append("<ajax-response>");

sb.append("<total>");

sb.append(total);

sb.append("</total>");

sb.append("<hello>");

sb.append("hello");

sb.append("</hello>");

sb.append("</ajax-response>");

out.println(sb.toString());

%>

and at the client side you have to restructure the below code snippet

var xmlHttp

function postRequest(strURL){

if(window.XMLHttpRequest){ // For Mozilla, Safari, ...

xmlHttp = new XMLHttpRequest();

}

else if(window.ActiveXObject){ // For Internet Explorer

xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");

}

xmlHttp.open('POST', strURL, true);

xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

xmlHttp.onreadystatechange = function(){

if (xmlHttp.readyState == 4){

if(xmlHttp.status == 200){

updatepage(xmlhttp.responseXML.documentElement);

}

}

}

xmlHttp.send(strURL);

}

/*Parsing the XMLResponse & updating the form fields according*/

function updatepage(dom){

var x = dom.getElementsByTagName("ajax-response")

var total

var hello

for(var i = 0;i < x.length; i++){

var er

total = x[i].getElementsByTagName("total")

{

try{

// updating the result

document.f1.result.value = total[0].firstChild.data

} catch(er){

}

}

hello = x[i].getElementsByTagName("hello")

{

try{

// updating the hello message

document.f1.helloField.value = hello[0].firstChild.data

} catch(er){

}

}

}

}

NOTE: there is an other way of doing this which by using JSON object a simple google search would give you a lot of useful links.

Hope that might help :)

REGARDS,

RaHuL

RahulSharnaa at 2007-7-12 3:33:41 > top of Java-index,Enterprise & Remote Computing,Web Tier APIs...
# 4
hi' thanks for the answer. i guess that this is the solution..Regards,Hudoq
hudoqa at 2007-7-12 3:33:41 > top of Java-index,Enterprise & Remote Computing,Web Tier APIs...
# 5

Hey' sory for late response...

i think you're wrong, cos the code that you posted had an error.

//This is what error say...

'null' is null or not an object

The error refer to :

var x = dom.getElementsByTagName("ajax-response")

What's wrong? and when i try to give this code :

alert (xmlHttp.responseXML.documentElement);

It will give null value...

Thanks..

hudoqa at 2007-7-12 3:33:41 > top of Java-index,Enterprise & Remote Computing,Web Tier APIs...
# 6

i think i know what's the problem is, u cannot using StringBuffer.toString() to send response to the client. U should send it with print one by one.

i don't know this is good mechanism or not? cos when i try to print it one by one, i got the correct result.

This is seems weird for me but this is the only solution for now.

//your code : this is will return 0 . we cannot use this.

xmlHttp.responseXML.documentElement

//Just use this. it works for me.

xmlHttp.responseXML

i hope i will get a better solution in this forum..

Thanks...

Message was edited by:

hudoq

hudoqa at 2007-7-12 3:33:41 > top of Java-index,Enterprise & Remote Computing,Web Tier APIs...
Enterprise & Remote Computing
Web Tier APIs

Enterprise & Remote Computing New Topic

Enterprise & Remote Computing Hot Topic

Enterprise & Remote Computing

All Classified