Help passing variables between functions in ajax callbacks

OK I am building something that makes an ajax request to one server where it determines the url it needs to then make a new ajax request to another place. Everything is progressing thanks to all the help at SO =) .. however I am stuck again. I am struggling with getting the variables to return to the different functions as I need. The second (jsonp) request returns a json function which looks like :

jsonResponse(
{"it.exists":"1"},"");

and my code...

var img = "null";
var z = "null";

$(document).ready(function()
{
  $.ajax({
    type: "GET",
    url: "connect.php",
    dataType: "xml",
    success:   function  parseXml(data)
        {
          $(data).find("ITEM").each(function()
            {
            query = $("SKU", this).text();
            query = 'http://domain.com/' + query + '?req=exists,json';
            img = $("SKU", this).text();
            img = '<img src="http://domain.com/' + img + '">';  
            var date =$("LAST_SCAN" , this).text();
                $.ajax({
                    url: query,
                    dataType: 'jsonp'       
                    开发者_StackOverflow社区});
                $("table").append('<tr>'+'<td>' + (date) + '</td>' + '<td>' + (z) + '</td>');
            });
        }
    });
});

// function required to interpret jsonp

function jsonResponse(response){
  var x = response["it.exists"];
  // console.log(x); 
  if (x == 0) {
    console.log("NO"); 
    var z = "NO IMG";
    }
  if (x == 1) {
   console.log(img); 
    //this only returns the first image path from the loop of the parseXml function over and over
    var z = (img);  
  }
    return z;
}

So I guess my problem is a two parter.. one how do I get the img variable to loop into that if statement and then once that works how can I return that z variable to be used in the first xml parser?

Try this synchronous approach:

var itemQueue = [];

$(document).ready(function ()
{
    $.ajax({
        type: "GET",
        url: "connect.php",
        dataType: "xml",
        success: function parseXml(data)
        {
            itemQueue= $(data).find("ITEM").map(function ()
            {
                return {
                    sku: $("SKU", this).text(),
                    date: $("LAST_SCAN", this).text()
                };
            }).get();
            getNextItem();
        }
    });
});

function getNextItem()
{
    var item = itemQueue[0];
    var query = "http://domain.com/" + item.sku + "?req=exists,json";
    $.ajax({
        url: query,
        dataType: 'jsonp'
    });
}

function jsonResponse(response)
{
    var item = itemQueue.shift();
    if (itemQueue.length)
    {
        getNextItem();
    }
    var x = response["it.exists"];
    var z = x == "0" ? "NO IMG" : "<img src=\"http://domain.com/" + item.sku + "\">";
    $("table").append("<tr><td>" + item.date + "</td><td>" + z + "</td>");
}

Store 'date' in a global variable, and move the logic to append HTML elements into the jsonResponse function. You cannot return control flow from jsonResponse because it's called asynchronously, but you can continue doing anything you'd like from that function.