error calling jsonp cross-domain webservice

Question

I'm a .NET developer trying to create a simple cross-platform (Android/iOS) app using PhoneGAP. I have problem in using my .NET web services in PhoneGAP app, it is my JS code:

    function DoIt()
{
    var surl = "http://www.silverlight4web.com/onlinegame/rest.aspx";
    $.ajax({
        type: 'GET',
        url: surl,
        crossDomain: true,
        contentType: "application/javascript",
        data: { "UserID": "1234" },
        dataType: "jsonp",
        success: function(val) {
            var myjsonobject = val;
            alert(myjsonobject.accounting[0].firstname + ' ' + myjsonobject.accounting[0].lastname);
        },
        error: function(xhr, status, error) { alert(error); },
        async: false,
        cache: false
    });

}
DoIt();

and it is my server side page (CS):

        public string output = "";
    protected void Page_Load(object sender, EventArgs e)
    {
        if (Request.Params["callback"] != null)
        {
            output = Request.Params["callback"] + "(" + GetData() + ");";
        }
    }

    public string GetData()
    {
        string r = @"
            { ""accounting"" : [   // accounting is an array in employees.
                                { ""firstName"" : ""John"",  // First element
                                  ""lastName""  : ""Doe"",
                                  ""age""       : 23 },

                                { ""firstName"" : ""Mary"",  // Second Element
                                  ""lastName""  : ""Smith"",
                                  ""age""       : 32 }
                              ], // End ""accounting"" array.                                 
              ""sales""       : [ // Sales is another array in employees.
                                { ""firstName"" : ""Sally"", // First Element
                                  ""lastName""  : ""Green"",
                                  ""age""       : 27 },

                                { ""firstName"" : ""Jim"",   // Second Element
                                  ""lastName""  : ""Galley"",
                                  ""age""       : 41 }
                              ] // End ""sales"" Array.
            }";

        return r;
    }

(ASPX):

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Rest.aspx.cs" Inherits="OnlineG.Rest" %>
<%=output %>   
..... HTML page

</div>
</form>

I get following error:

Error: jQuery182046418637151657827_1408038693745 was not called

The number in front of JQuery changes each time, I've seen some instances of this problem in google but none of the post could solve my problem, what is going wrong? should I check/change anything on my server or some code is missing?

Answer 1

I has the similar problems before (the server side I used node.js), don't remember how I exactly fix it. I don't have environment to test your case. But here are some hints for you to fix them,

1. You need pass the call back function name in the url, so it should be, var surl = "http://www.silverlight4web.com/onlinegame/rest.aspx?callback=success",

2. Write a separate js function in your page to do the json data process, like,

    
   function success(data) {
   //your code
   var myjsonobject = data;
   alert(myjsonobject.accounting[0].firstname + ' ' + myjsonobject.accounting[0].lastname);
   }
   function DoIt()
   {
   var surl = "http://www.silverlight4web.com/onlinegame/rest.aspx";
   $.ajax({
       type: 'GET',
       url: surl,
       crossDomain: true,
       contentType: "application/javascript",
       data: { "UserID": "1234" },
       dataType: "jsonp",
       success: function(val) {
           success(val);
       },
       error: function(xhr, status, error) { alert(error); },
       async: false,
       cache: false
   });
   
   }
   DoIt();
   

3. Make sure the server side will finally return "success(your json data);", if the following code not work, you have to use separate web api/service to do it;

    
   protected void Page_Load(object sender, EventArgs e)
   {
       if (Request.Params["callback"] != null)
       {
           //here will return "success(...)"
           output = Request.Params["callback"] + "(" + GetData() + ");";
       }
   }
   

4. Probably you need specify the output content type in server side, like, ...Response.ContentType = "application/javascript";

Let me know if it works:)