How to load functions by sequentiall in jquery

[eluser]shankar ganesh[/eluser]
Hi all,

I am need to call the function one after another, ie, the first function should complete the complete task and then second function to be triggered and after completing the second function's tasks third function need to called.

How can this can be accomplished using jquery and delay() should not be used.

eg:

There are 2 function
1. Load json files()
2. Display json files()

Code:

var ALL_RESULTS = new Arrary();
var MASTER_RESULT = new Arrary();

function load_json_files()
{
        for(i=0;i<MASTER_RESULT.length;i++)
        {
                    $.getJSON(MASTER_RESULT[i], function(result) {
                        ALL_RESULTS[i] = result;
                    });                    
        }
        display_json_files();
}
function display_json_files()
{
    alert(ALL_RESULTS.length);
}

In the above eg MASTER_RESULT.length = 12, after completely loading all 12json files the second function display_json_files() need to be triggered.

But its not, the function display_json_files() is called before completely loading all the json files.

Is there any other way to accomplish this apart from using delay().

Thanks in advance.

[eluser]CroNiX[/eluser]
Wow, ajax requests in a loop usually isn't that good of an idea.
What I would do instead, is send the MASTER_RESULT array to your controller, as is, do your processing and return a json object of all of your results in one go. I would also use a regular $.ajax() request instead of the $.getAJAX() shorthand and use the onComplete event to call your 2nd function.

So, 1 ajax request to get all results instead of many and building an array from all of those requests.

I also assume you actually put some data in your MASTER_RESULT somewhere, and spell Array() correctly

[eluser]Bhashkar Yadav[/eluser]
Could you please use

Code:

$.ajaxSetup({async:false});

just after start of the function and use

Code:

$.ajaxSetup({async:true});

before end of function.
Like:

Code:

function load_json_files()
{
$.ajaxSetup({async:false});

/*
Some Code
*/

$.ajaxSetup({async:true});
}

I hope this should work well.

[eluser]shankar ganesh[/eluser]
Hi,
I updated the code as below based on previous reply, it works fine,thanks very much

Code:

var ALL_RESULTS = new Arrary();
var MASTER_RESULT = new Arrary();

function load_json_files()
{
        $.ajaxSetup({async:false});
        for(i=0;i<MASTER_RESULT.length;i++)
        {
                    $.getJSON(MASTER_RESULT[i], function(result) {
                        ALL_RESULTS[i] = result;
                    });                    
        }
        $.ajaxSetup({async:true});
        display_json_files();
}
function display_json_files()
{
    alert(ALL_RESULTS.length);
}

Thank you very much

[eluser]Bhashkar Yadav[/eluser]
Your always welcome