Question

I have an aspx page that returns valid JSON – however when called via JQUERY I can see in Fiddler that the JSON is returned but an error is thrown [Object error].

   protected void Page_Load(object sender, EventArgs e)
   {
    string json = "{\"name\":\"Joe\"}";
    Response.ClearHeaders();
    Response.ClearContent();
    Response.Clear();
    Response.Cache.SetCacheability(HttpCacheability.NoCache);
    Response.ContentType = "application/json";
    Response.ContentEncoding = Encoding.UTF8;
    Response.Write(json);
    Response.End();
   }

The html page consuming this page is in a different domain, and I am using jsonp.

function jsonpCallback(response){
    alert(response.data);
}

$(document).ready(function(){ 

            $.ajax({
                url: 'http://localhost:30413/getprice.aspx',
                dataType: 'jsonp',
                error: function(xhr, status, error) {
                    alert(error);
                },
                success: jsonpCallback
            });

}); 

When the aspx page is requested valid JSON is returned to the browser, when the JQUERY call is made JSON is returned but the callback function is not called and an Expected “;” JS error then an [Object error] message is displayed. Below are the request and responses made.

I’ve tried every variation of the request with the same result. I am using the request JQUERY sample below because it works in the last sample shown below.

GET http://localhost:30413/price.aspx?callback=jQuery17105556924406763212_1338876162569&_=1338876162581 HTTP/1.1
Accept: application/javascript, */*;q=0.8
Referer: http://alpha.tigerdirect.com/applications/b2b/varinfo.asp
Accept-Language: en-US
User-Agent: Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; WOW64; Trident/5.0)
Accept-Encoding: gzip, deflate
Host: localhost:30413
Connection: Keep-Alive
Pragma: no-cache
Cookie: ASP.NET_SessionId=d4pje2hgm2beznslfpp4pii5



HTTP/1.1 200 OK
Server: ASP.NET Development Server/10.0.0.0
Date: Tue, 05 Jun 2012 06:02:42 GMT
X-AspNet-Version: 4.0.30319
Cache-Control: no-cache
Pragma: no-cache
Expires: -1
Content-Type: application/json; charset=utf-8
Content-Length: 14
Connection: Close

{"name":"Joe"}

This sample works

function jsonpCallback(response){
    alert(response.data);
}
$(document).ready(function(){ 
        $.ajax({
            url: 'http://api.bitbucket.org/1.0/repositories/retroviz/webformsthemeswitcher/src/tip/.hgignore',
            dataType: 'jsonp',
            error: function(xhr, status, error) {
                alert(error);
            },
            success: jsonpCallback
        });
}); 

Answer 1

Change url in ajax to url: http://localhost:30413/getprice.aspx?callback=?

And

if(Request.QueryString['callback']!=null){
    string callback = Request.QueryString['callback'];
    string json = "{\"name\":\"Joe\"}";
    Response.ClearHeaders();
    Response.ClearContent();
    Response.Clear();
    Response.Cache.SetCacheability(HttpCacheability.NoCache);
    Response.ContentType = "application/json";
    Response.ContentEncoding = Encoding.UTF8;
    Response.Write(callback + "(" + json + ")");
    Response.End();
}

In jsop, we wrap the response in callback function call. Just like we call a function in javascript.