Pulling JSON into phonegap results in 404

I'm trying to set up a JSON query for PhoneGap that pulls in JSONP created through an Expression Engine template. If I navigate directly to my JSON page, http://www.lcbcchurch.com/mobileJSON/homeslideshow, I get the correct output. Trying to pull it into my iphone app (phonegap) is another story. It's saying that it can't be found (404) in the console. I checked all my links and I think I'm doing the callback method correctly, but nothing seems to work. Please help. Here's my code for the EE plugin:

{exp:json:entries channel="slideshow" jsonp="yes" callback="{segment_3}" content_type="application/javascript"}

and the app code:

<!DOCTYPE html>
<html>
    <head>
        <title>PhoneGap Ajax Sample</title>
        <script type="text/javascript" src="phonegap.js"></script>
        <script type="text/javascript" src="js/jquery.js"></script>
        <script type="text/javascript">
            $.ajax({
                       url: "http://www.lcbcchurch.com/mobileJSON/homeslideshow/results",
                       dataType: "jsonp",
                       jsonp: false
                       });
                function results(data) {
                    console.log(data);
                }

            </script>


    </head>
    <body>
        <div id="main">

        </div>
    </body>
</html>

Solution

have you made sure that you're white listing all external hosts in your xcode project? also your ajax call looks a bit off... You have the callback added like a directory vs an argument.. if you remove that and just have the success function call it that will work.

with phonegap you don't need to worry about crossdomain, all you need to do is whitelist all domains in your xcode project by adding a new value to externalHosts in your phonegap.plist file - set the key to 'websites' and value to '*' that's a catch all.

$.ajax({
  url: "http://www.lcbcchurch.com/mobileJSON/homeslideshow",
  dataType: "json",
  success:function(data){
    results(data);
  }
});

function results(data) {
  for(var i = 0; i<data.length;i++){
    // this will log all of the images url
    console.log(data[i].image); // just access the part you want by it's name.
  }
}