Question

Can someone please explain the following. I’ve scoured the net for ages trying to find help and I believe I’m doing everything correctly but still getting errors.

I have the following script on my page:

        function GetPageAdvert2(url) {

            $.getJSON('http://url/servicename.asmx/CheckAdvert?callback=?', 
            {
                pagename:   url,
                success:    function(data) { alert(data) }
            });        
        };

And my webservice returns nothing more than:

jsonp1301065851157('url/KiN_150x300.jpg');

The problem is that when I call GetPageAdvert2, nothing is happening.

My WebService (written in VB.Net) is:

        <WebMethod()> _
<ScriptMethod(ResponseFormat:=ResponseFormat.Json, XmlSerializeString:=False, UseHttpGet:=True)> _
Public Sub CheckAdvert(ByVal pagename As String, ByVal callback As String)

    Dim pageUID As Integer = 0
    Dim advertURL As List(Of aU) = New List(Of aU)()

    Dim sss As String

    Using con As New System.Data.SqlClient.SqlConnection(My.Settings.sqlConnection2)

           SQL STUFF IN HERE
           the SELECT statement will return a value and place it in Variable SSS


    End Using

    Context.Response.ContentType = "application/json"
    Context.Response.Write(callback & "('" & sss & "');")
    Context.Response.End()


End Function

The response I’m getting back (in FF) is:

PARAMS:
callback    jsonp1300979718942
contentType application/json; charset=utf-8
pagename    default.html
success undefined

RESPONSE:
jsonp1301065851157('url/KiN_150x300.jpg');

This is mostly, what I believe, to be correct.

However the “Alert(data)” isn’t producing anything other than “undefined”.

Answer 1

When using JSONP, you can’t simply return a JSON string, as the string returned will actually get injected into the current page in a new script element. You need to return a valid JavaScript statement that calls a callback handler, in which the response is parsed.

There’s an example on the Wikipedia page:

parseResponse({"Name": "Cheeso", Id : 1823, "Rank": 7})

Note that above syntax is not valid JSON, which is in this case not needed, as you only pass a JavaScript object in literal notation.

Moreover, as x10 said in his comment, jQuery changes the ? in the callback query parameter to a unique function, which you should call, so don’t just copy-paste the above example, but replace parseResponse with the mentioned parameter.

Update: the final thing you should change are the parameters to jQuery.getJSON: the syntax looks like:

jQuery.getJSON( url, [ data ], [ success(data, textStatus, jqXHR) ] )

So you should just pass your success function as the second or third parameter, not as part of an object (compare this to the general jQuery.ajax() function call):

$.getJSON("***URL***.asmx/CheckAdvert?callback=?", function(data) { callback(data) });