title: Facebook api multiple request
body: <p>I am creating a facebook application generator. And I need to check if the user has currently added the application on this facebook page or not. </p>
  
  <p>In order to do that, i first request facebook api to give a list of his pages. Then i loop through all the pages. And request for apps on each of these pages. </p>
  
  <p>Lastly i compare the appId with the one user just created and displays the display the warning accordingly.</p>
  
  <p>The problem is , when i loop through each of the pageId and request FbApi for subpages, the request response is delayed and the for each loop completes its cycle before the results are fetched from facebook. </p>
  
  <p>Here is my code, which is quite complex... Any ideas to fix the issue is highly appreciated.</p>
  
  <pre><code>FB.login(function (response) {
  
      FB.api('/me/accounts', function (apiresponse) {
  
          var totalPages = apiresponse.data.length;
          var pageIndex = 0;
          $.each(apiresponse.data, function (pageNumber, pageData) {
  
              var pageAccessToken = pageData.access_token;
              var tabPageName = pageData.name;
              var tabPageId = pageData.id;
  
              FB.api("/" + tabPageId + "/tabs", function (response) {
  
                  var foundApp = false
  
                  $.each(response.data, function (index, value) {
                      var exsistingAppId = (value.id).split("app_").pop();
                      if (exsistingAppId == fbAppId) {
                          foundApp = true;
                      }
                  });
  
                  if (foundApp === true) {
  
                      var data = {
                          PageId: tabPageId,
                          Url: window.location.href.split("/").pop()
                      }
  
                      $.ajax({
                          type: "POST",
                          url: '/facebook/Match',
                          contentType: "application/json",
                          data: JSON.stringify(data),
                          success: function (data) {
                              if (data == "True") {
                                  $("#addToFacebookModal ul").append("&lt;li&gt;&lt;span class='pageTab'&gt;&lt;a class='pageTabName' target='_blank' href='https://facebook.com/profile.php?id=" +tabPageId + "'&gt;" +tabPageName + "&lt;/a&gt;&lt;/span&gt;&lt;a class='deleteAppFromPageTab' data-id='" +tabPageId + "' data-accessToken='" +pageAccessToken + "'&gt;[x]&lt;/a&gt;&lt;/li&gt;");
                                  alreadyAdded.push(true);
                              } else {
                                  alreadyAdded.push(false);
                              }
  
                              pageIndex++;
  
                              if (pageIndex == totalPages) {
                                  console.log("Total Pages = " + totalPages + ", Looped through = " + alreadyAdded.length);
                                  if (alreadyAdded.indexOf(true) &gt;= 0) {
                                      $("#addToFacebookModal").modal();
                                  } else {
                                      addToFacebook();
                                  }
                              }
                          }
                      });
                  }
                  else {
                      pageIndex++;
                  }
  
              });
  
          });
      });
  }, { scope: 'manage_pages' });
  </code></pre>
  
  <p>Here is pseudocode of what i am doing</p>
  
  <p>var myVariable
  -Fb.Api Callback function returns response array
  -Loop through the response array 
  -Get new Response array based on the previous response in that array
  -Loop through each item of the new response array and compare it with myVariable. </p>
  
  <p>The problem is that responses are delayed while the loop finishes up  before the responses arrive. As i result i cant compare the nested Item with myVariable.</p>