473,322 Members | 1,232 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,322 software developers and data experts.

Synchronizing multiple AJAX calls in window.onload() event

I'm sure this q must have been asked before but I'm really struggling
to find the answer anywhere so have finally given up and will consult
the usenet community - hopefully there's someone out there who's seen
it all before and can help me out! I have a webpage which needs to
make some function calls after the page has loaded - won't go into
details surfice to say here is a code fragment:

function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload == 'function') {
window.onload = function() {
oldonload();
func();
}
} else {
window.onload = func;
}
}

addLoadEvent(myFunction1);
addLoadEvent(myFunction2);
addLoadEvent(myFunction3);
...etc...

My problem is that some of these myFunction#s include AJAX calls but
the calls depend on each other in such a way that myFunction2 will not
work unless myFunction1 has completed. So what is the "nicest" way to
make sure of this? I've considered putting a hidden element in the
HTML and then changing it at the end of each function call and have
the onchange event trigger the next function call. But this seems very
hacky and overcomplicated - surely there must be a simpler and better
way....?

Cheers for any advice / suggestions,

Steve

May 18 '07 #1
5 6135
On 18 May, 22:17, steve.chamb...@gmail.com wrote:
I'm sure this q must have been asked before but I'm really struggling
to find the answer anywhere so have finally given up and will consult
the usenet community - hopefully there's someone out there who's seen
it all before and can help me out! I have a webpage which needs to
make some function calls after the page has loaded - won't go into
details surfice to say here is a code fragment:

function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload == 'function') {
window.onload = function() {
oldonload();
func();
}
} else {
window.onload = func;
}
}

addLoadEvent(myFunction1);
addLoadEvent(myFunction2);
addLoadEvent(myFunction3);
...etc...

My problem is that some of these myFunction#s include AJAX calls but
the calls depend on each other in such a way that myFunction2 will not
work unless myFunction1 has completed. So what is the "nicest" way to
make sure of this? I've considered putting a hidden element in the
HTML and then changing it at the end of each function call and have
the onchange event trigger the next function call. But this seems very
hacky and overcomplicated - surely there must be a simpler and better
way....?

Cheers for any advice / suggestions,

Steve
Could you use the readyState of one AJAX request to control the next
function?
May 18 '07 #2
On 18 May, 23:43, charles <char...@boisvert.me.ukwrote:
On 18 May, 22:17, steve.chamb...@gmail.com wrote:
I'm sure this q must have been asked before but I'm really struggling
to find the answer anywhere so have finally given up and will consult
the usenet community - hopefully there's someone out there who's seen
it all before and can help me out! I have a webpage which needs to
make some function calls after the page has loaded - won't go into
details surfice to say here is a code fragment:
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload == 'function') {
window.onload = function() {
oldonload();
func();
}
} else {
window.onload = func;
}
}
addLoadEvent(myFunction1);
addLoadEvent(myFunction2);
addLoadEvent(myFunction3);
...etc...
My problem is that some of these myFunction#s include AJAX calls but
the calls depend on each other in such a way that myFunction2 will not
work unless myFunction1 has completed. So what is the "nicest" way to
make sure of this? I've considered putting a hidden element in the
HTML and then changing it at the end of each function call and have
the onchange event trigger the next function call. But this seems very
hacky and overcomplicated - surely there must be a simpler and better
way....?
Cheers for any advice / suggestions,
Steve

Could you use the readyState of one AJAX request to control the next
function?
I don't think so, you're right in that the readyState tells me when
the AJAX call has completed but my problem is I need to know when the
resulting funcion has completed its processing (e.g. one of my
functions writes information to a database, which takes time. As
always, probably some more example code will help explain what I mean:

function function1() {
var ajax_connection = createRequest();
ajax_connection.open('get', 'getinfofromserver.php');
ajax_connection.onreadystatechange = function() {
doSomeDatabaseStuff(ajax_connection);
}
ajax_connection.send(null);
}

function doSomeDatabaseStuff(ajax_connection) {
// Only proceed if the state change is a completion
if (ajax_connection.readyState == ReadyStateEnum.COMPLETE) {
// Do some database stuff here
...
}
}

May 19 '07 #3
I have a webpage which needs to
make some function calls after the page has loaded - won't go into
details suffice to say here is a code fragment:
window.onload = function() {
myFunction1();
myFunction2();
myFunction3();
}
My problem is that some of these myFunction#s include AJAX calls but
the calls depend on each other in such a way that myFunction2 will not
work unless myFunction1 has completed. So what is the "nicest" way to
make sure of this? I've considered putting a hidden element in the
HTML and then changing it at the end of each function call and have
the onchange event trigger the next function call. But this seems very
hacky and overcomplicated - surely there must be a simpler and better
way....?
Could you use the readyState of one AJAX request to control the next
function?
I don't think so, you're right in that the readyState tells me when
the AJAX call has completed but my problem is I need to know when the
resulting funcion has completed its processing (e.g. one of my
functions writes information to a database, which takes time. As
always, probably some more example code will help explain what I mean:

function function1() {
var ajax_connection = createRequest();
ajax_connection.open('get', 'getinfofromserver.php');
ajax_connection.onreadystatechange = function() {
doSomeDatabaseStuff(ajax_connection);
}
ajax_connection.send(null);
}

function doSomeDatabaseStuff(ajax_connection) {
// Only proceed if the state change is a completion
if (ajax_connection.readyState == ReadyStateEnum.COMPLETE) {
// Do some database stuff here
...
}
}
In that case could you use the server response to control the timing?
Write the getinfofromserver.php script so that when ajax_connection is
complete, you know all the processing on the server is complete. Then
you can call doSomeDatabaseStuff safely.

Maybe I'm missing something simple, because I don't see how using a
form and onChange() would solve the problem.
May 19 '07 #4
On May 19, 1:27 am, charles <char...@boisvert.me.ukwrote:
My problem is that some of these myFunction#s include AJAX calls but
the calls depend on each other in such a way that myFunction2 will not
work unless myFunction1 has completed. So what is the "nicest" way to
//Maybe something like (untested):

var set1 = new Array({url:'bs.pl',fx:function1},
{url:'morebs.pl',fx:function2});
var set2 = new Array({url:'foo.pl',fx:function3},
{url:'bass.pl',fx:function4});
var actions = new Array(set1,set2);

for(var i in fx) {
requestChain(fx[i])
}
function requestChain(chain) {

var set = chain.shift();
var req = AJAXRequest();

req.onreadystatechanged = function () {
//AJAX state checks...
if( set.fx() ) {
if(chain.length 0) new requestChain(chain);
}
};

req.open('get',set.url);
//etc....
}
May 20 '07 #5
On May 20, 3:14 am, "Skye Shaw!@#$" <skye.s...@gmail.comwrote:
On May 19, 1:27 am, charles <char...@boisvert.me.ukwrote:
My problem is that some of these myFunction#s include AJAX calls but
the calls depend on each other in such a way that myFunction2 will not
work unless myFunction1 has completed. So what is the "nicest" way to

//Maybe something like (untested):
<snip>
var actions = new Array(set1,set2);

for(var i in fx) {
requestChain(fx[i])

}
oops, should be: for(var i in actions) {}
function requestChain(chain) {
if( set.fx() ) {
if(chain.length 0) new requestChain(chain);
new isn't necessary. Sorry, was a tad sleepy

May 20 '07 #6

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

6
by: Brian | last post by:
Hi everyone, I'm writing a function (in javascript) that needs to do one thing if the page has not loaded, and another (different) thing if the page has already loaded. I'm looking for a way...
2
by: Emmanuel | last post by:
Hi, I'm working on a c# web app and require having some code which runs in the page Load event of each page and to be reusable in other web apps. So i decided to use a Class Library which...
4
by: Matt Ratliff | last post by:
Hello, I would appreciate any assistance you have with the following problem: I have (as an example) an array of values as follows: arrayvalues=new Array("0001","0003","0005") where each is the...
0
by: Tarik Monem | last post by:
I have been working on an all AJAX/DOM web site which is set to go live today and I thought I'd share my discoveries with all of you whom have helped me when I have encountered different issues along...
5
by: lilOlMe | last post by:
Hi there! I'm developing some crazy Tab Control in .NET that uses JavaScript. A particular JavaScript method needs to be called during the window.onload event in order to initialize my Tab...
1
by: violinandviola | last post by:
I have just put 4 different ajax bits on this page: http://jimpix.co.uk/default-ajax.asp The ajax spits out chunks of images / news content, and users can view the chunks via next / prev links....
1
by: bizt | last post by:
Hi, I am having my first real attempt at an ajax class as so far Ive managed to build one that, once instatiated, will allow me to define which function it will call on completion then retrieves...
2
by: burtonfigg | last post by:
I'm testing an ajax page - this works fine in Firefox: http://jimpix.co.uk/clients/a/ecards/defaultx.asp Click on any of the links on the right under the 'occassions' or 'others' headings, in...
1
by: petvampire | last post by:
not sure if some one got a answer to this little issue. Im built a page that calls information from a page called database-update.asp and puts it in to the div tag Reload this. What i am trying to do...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
1
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
0
by: af34tf | last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.