Question

"fnServerData": function( sUrl, aoData, fnCallback, oSettings ) {
            oSettings.jqXHR = $.ajax( {
                "url": sUrl,
                "data": aoData,
                "success": fnCallback,
                "error":function(msg){
                    alert(msg);
                },
                "dataType": "jsonp",
                "cache": false
            } );
        },

When I make that request, server gives that response.

Status Code: 200 OK
Cache-Control: max-age=0
Content-Language: en
Content-Type: application/javascript
Expires: Thu, 12 Jul 2012 06:23:18 GMT
Last-Modified: Thu, 12 Jul 2012 06:23:18 GMT
Vary: Accept-Language, Cookie

And a json data in Response body.

But ajax code says it has an error, and going into “error” code block.

Why it is giving error while its status is 200?

UPDATE:

In Django server code:

            response_dict = {}                
            response_dict.update({'aaData': aaData})
            response_dict.update({'sEcho': sEcho, 'iTotalRecords': iTotalRecords, 'iTotalDisplayRecords':iTotalDisplayRecords, 'sColumns':sColumns})
            response = HttpResponse(simplejson.dumps(response_dict), mimetype='application/javascript')

Answer 1

Does the server response contain JSON with padding?

You see, there are two ways to receive data from different domain:

1. CORS is the new one but requires a separate Access-Control-Allow-Origin header to be sent from the server. Browser support is also somewhat limited for it.

2. JSONP doesn’t rely on a server header but instead requires it to send back JSON data with so-called ‘padding’:

   callback('{"your": ["json", "data"}')
   

   Your JavaScript library (jQuery in this case) is then wraps it into a new script tag tricking your browser to evaluate it. Inside this callback function jQuery parses the JSON data and sends it to your fnCallback. After that it removes the unnecessary script tag from the page. In general it’s a very fragile solution but it works in practice. For example, if the server doesn’t pad JSON data you’ll end up with the following code inside a script tag:

   '{"your": ["json", "data"}'
   

   Notice that it’s just a string and does nothing. So, check if the server sends the wrapped JSON and not the raw JSON. I’ve run into the same problem quite a few times before and that helped me.

---

EDIT: Since you posted your server-side code I assume that you can modify it. I’ve never played with Django but I’ll try to give you hints:

1. Inside the request that you receive there should be a parameter called callback – that’s what jQuery sends to you and what you should use for padding. Put it somewhere:

   # Like I said I don't know the exact API but you get the idea
   callback = request.GET["callback"]
   

2. After that pad your response before sending it to client:

   response = HttpResponse( # Put callback name before the actual JSON
                  callback + "(" + simplejson.dumps(response_dict) + ");", 
                  mimetype='application/javascript')
   

This should work.