JQuery ajax "too much recursion"

Question

I have a procedure that goes through 5 consecutive steps, and on my page I call the ajax method for each of them.

The idea is to start the first, if everything is fine, the second, etc.

My code is:

$("#foo").click(function(){ $.ajax({ url: 'ajax.php', async: false, data: { step: 1 }, dataType: 'json', type: 'GET', success: walk_through(data) }); }); function walk_through(data) { if(data.status == 'ok') { if(data.next_step == 'end') { // All steps completed } else { // Current step completed, run next one $.ajax({ url: 'ajax.php', async: false, data: { step: data.next_step }, dataType: 'json', type: 'GET', success: walk_through(data) }); } } else { alert("Error."); console.log(data); } } 

I get a "too much recursion" error even if my ajax calls are set as synchronous .. why?

Answer 1

Edit

success: walk_through(data)

For

success: walk_through

You want the walk_through function walk_through be a success handler, but you do not want to call the function immediately.

Answer 2

Your JavaScript does not match your AJAX call:

 $.ajax({ url: 'ajax.php', async: false, data: { step: data.next_step }, dataType: 'json', type: 'GET', success: walk_through //You had walk_through(data), which makes a function call, rather than a reference to a function. }); 

Answer 3

Your walk_through function calls itself every time it succeeds.