Building a standard AJAX function

[Sandman]

So, I've used ajax for quite some time for different stuff. Mostly I
just feed a funktion I made with the ID of the DIV that should be
updated with the output from page XXX.php

Now I want to have a standard funktion to set a JS variabel to the
output of a page. I am doing a date validation thing, which is done in
PHP. So this is how far I've come so far:

function ajaxresults(url){
var ajax = createAjaxObject();
ajax.onreadystatechange = handleAjaxReturn;
ajax.open("GET", url, true);
return ajaxReturned;
}

"createAjaxObject" is a function that I use all the time that
initializes the request.

So, I have this function to handle the readystatechanges:

function handleAjaxReturn(){
if (ajax.readystate == 4){
if (ajax.status == 200){
ajaxReturned = ajax.responseText;
}
}
}

This function sets "returned" to the value of the finnished script.
So, now I want to use these function in a practical example:


On the page, I might have this:

<input type='text' name='date' onblur="datevalidate(this)" />

and a script like this:

function datevalidation(field){
if (field.value != ""){
var eVal = escape(field.value);
var vDate = ajaxresult("datecheck.php?d=" +eVal;
field.value = vDate
}
}


So, basically, the idea is that the value of the input field should be
replaced by the output of datecheck.php. But it isn't, since vDate is
"undefined"

It is undefined because ajaxresult() doesn't return any value. And
ajaxresult() doesn't return any value because it ends before the HTTP
request reaches readystate 4.

So, basically, how do I construct the two first functions so that
ajaxresult() returns the data from the ajax object that is processed
by handleAjaxReturn()? The last function must remain intact, since I
want to be able to use this as a standard function for various
functions. I.e. nothing in ajaxresults() or handleAjaxReturn() must
relate to date validation or setting the value of the field in my
example. ALl they should do is fetch the output of a given URL and
return it to the caller.

So, any ideas?

 

[Pazabo]

Hi,

ajax.open(_sth_, _sth_, true)

means that call is asynchronous, so "handleAjaxReturn()" is run after
response comes from the server, while "return ajaxReturned" acts
immediately (you don't know the returned value yet).

 

[VK]

Yes, that's exactly what I wrote in my post. So what do I do about it?

"AJAX Solutions" over the last two years effectively replaced the age
old drop down menu hobby. Before that anyone anyhow involved in
JavaScript/DOM/CSS felt obligated to write at least one dynamic menu
by her own. I say if we put all menus of all kinds ever written across
the globe since the 4th versions release, in open state they would
make a chain from the Earth to the Moon Respectively I'm scared to
imagine the total bandwidth of ever made "AJAX" even if we take only
more-or-less working ones.

This long but - I hope - not nasty preface is to explain why for you
question
- what do I do about it?
the answer is:
- get yourself a cross-tested long existing cross-browser library with
a robust multiple requests support. In this NG it is traditionally
suggested - and no complains so far - AjaxRequest by Matt Kruse
http://www.ajaxtoolbox.com

 

[Sandman]

So, I've usedajaxfor quite some time for different stuff. Mostly I
just feed a funktion I made with the ID of the DIV that should be
updated with the output from page XXX.php

Now I want to have a standard funktion to set a JS variabel to the
output of a page. I am doing a date validation thing, which is done in
PHP. So this is how far I've come so far:

function ajaxresults(url){
varajax= createAjaxObject();
ajax.onreadystatechange = handleAjaxReturn;
ajax.open("GET", url, true);
return ajaxReturned;
}

"createAjaxObject" is a function that I use all the time that
initializes the request.

So, I have this function to handle the readystatechanges:

function handleAjaxReturn(){
if (ajax.readystate == 4){
if (ajax.status == 200){
ajaxReturned =ajax.responseText;
}
}
}

This function sets "returned" to the value of the finnished script.
So, now I want to use these function in a practical example:

On the page, I might have this:

<input type='text' name='date' onblur="datevalidate(this)" />

and a script like this:

function datevalidation(field){
if (field.value != ""){
var eVal = escape(field.value);
var vDate = ajaxresult("datecheck.php?d=" +eVal;
field.value = vDate
}
}

So, basically, the idea is that the value of the input field should be
replaced by the output of datecheck.php. But it isn't, since vDate is
"undefined"

It is undefined because ajaxresult() doesn't return any value. And
ajaxresult() doesn't return any value because it ends before the HTTP
request reaches readystate 4.

So, basically, how do I construct the two first functions so that
ajaxresult() returns the data from theajaxobject that is processed
by handleAjaxReturn()? The last function must remain intact, since I
want to be able to use this as a standard function for various
functions. I.e. nothing in ajaxresults() or handleAjaxReturn() must
relate to date validation or setting the value of the field in my
example. ALl they should do is fetch the output of a given URL and
return it to the caller.

So, any ideas?

Hi,

ajax.open(_sth_, _sth_, true)

means that call is asynchronous, so "handleAjaxReturn()" is run after
response comes from the server, while "return ajaxReturned" acts
immediately (you don't know the returned value yet).[/QUOTE]

Yes, that's exactly what I wrote in my post. So what do I do about it?