Ajax - Multiple jquery Cross Domain JSONP requests with each with the same callback

Questions

Can someone show me how to make 3 jsonp cross domain requests each with the same jsonp callback that simply gets content and writes it into the page?

I am trying to build an array of urls to loop through that i want to fire a jsonp request for each one of the urls. For each response i want to take that json object and then write the data into a section of the page. I dont care what order it is in. If i use the $.each function dont i need to take into account the scope? As i have only 1 callback function defined and i want to override the jsonp callback so it always calls the same function but that function is smart of enough to know which object was returned and to write it in to the page.

Here is my code:

    $(document).ready(function() {
        $.getJSON( /server/webcontent/js/env-urls-local.js , function(data) {


                $.each(data.env.urls, function(index, url) {
                        //alert(url.path);
                        $.ajax({
                            url: url.path, 
                            dataType:  jsonp ,
                            async: false,
                            cache: false,
                            done: function(sData, textStatus, jqXHR){

                                var targetreleasediv = "." + url.target +   td:nth-child(2) ;
                                var targetdescdiv = "." + url.target +   td:nth-child(3) ;

                                //alert(targetreleasediv);
                                //alert(targetdescdiv);

                                $(targetreleasediv).html(sData.env.v);
                                $(targetdescdiv).html(sData.env.desc);
                            },
                            fail: function(jqXHR, textStatus, errorThrown){
                                alert("Error " + jqXHR.responseText+ " error thrown is " + errorThrown + " status is " + textStatus);
                                var targetreleasediv = "." + url.target +   td:nth-child(2) ;
                                var targetdescdiv = "." + url.target +   td:nth-child(3) ;

                                //$(targetreleasediv).html("server is currently down");
                                //$(targetdescdiv).html("server is currently down");

                            }
                        });


                });


            });

    });

Here is the json array with the urls:

{
   "env":{
      "urls":[
         {
            "path":"http://server.domain.com/server/webcontent/js/evt2_server1.js",
            "target":"env2-server"
         },
         {
            "path":"http://server.domain.com/server/webcontent/js/evt2_server2.js",
            "target":"env2-server2"
         }
      ]
   }
}

Here is the json string the request is returning

{"env":{"v":"Tag_12345","desc":"Test of purpose"}}

Now i when i submit the page i get the json ajax requests but neither the done or fail method gets called.

Answers

$.each and $().each are different from a for loop in that for each item it loops through, the function that is ran on it is in it s own scope. You should be able to simply use the same callback in each jsonp call without worry.

Source

License : cc by-sa 3.0

http://stackoverflow.com/questions/7896170/multiple-jquery-cross-domain-jsonp-requests-with-each-with-the-same-callback

Related