带有jsonp的jQuery Ajax

Question

Hi all below is my code

$.ajax({
    'url': 'myUrl',
    'dataType': 'jsonp',
    crossDomain: true,
    'data': {
      // sample daa
    },
    'success': function (data) {
      alert("here::");
    },
    'error': function (jqxhr, status, errorThrown) {
      alert("Failure, Unable to recieve content : " + status)
      alert(jqxhr.responseText);
    })
})

I am using the jsonp as my url belongs to other domain and i am able to get the response code as 200 and i can able to see the data in response (Checcked in Firebug) but none of the success or error methods are executing.
Please help me on this

Update response(copied from firebug)

{"documents":[{"trans":"sdsd","orig":"How","translit":"Elā","src_translit":""}],"dict":[{"pos":"unknown","terms":["dgssdg","sgsd"],"entry":[{"word":"gsdg","reverse_translation":["method","treatment","recipe","attitude","how","retro"],"score":0.000305442198},{"word":"మార్గము","reverse_translation":["way","route","road","entry","how","impasse"],"score":0.000305442198}],"base_form":"how","pos_enum":20}],"src":"en","server_time":12}

Answer 1

This doesn't work because your server side script apparently is returning JSON instead of JSONP. Your server side script should be modified so that it returns JSONP if you want to be able to invoke it with a cross domain AJAX request.

You can read more about JSONP here: http://en.wikipedia.org/wiki/JSONP

So instead of:

{
    "documents": [
        {
            "trans": "sdsd",
            "orig": "How",
            "translit": "Elā",
            "src_translit": ""
        }
    ],
    "dict": [
        {
            "pos": "unknown",
            "terms": [
                "dgssdg",
                "sgsd"
            ],
            "entry": [
                {
                    "word": "gsdg",
                    "reverse_translation": [
                        "method",
                        "treatment",
                        "recipe",
                        "attitude",
                        "how",
                        "retro"
                    ],
                    "score": 0.000305442198
                },
                {
                    "word": "మార్గము",
                    "reverse_translation": [
                        "way",
                        "route",
                        "road",
                        "entry",
                        "how",
                        "impasse"
                    ],
                    "score": 0.000305442198
                }
            ],
            "base_form": "how",
            "pos_enum": 20
        }
    ],
    "src": "en",
    "server_time": 12
}

your server side script should return:

someCallback({
    "documents": [
        {
            "trans": "sdsd",
            "orig": "How",
            "translit": "Elā",
            "src_translit": ""
        }
    ],
    "dict": [
        {
            "pos": "unknown",
            "terms": [
                "dgssdg",
                "sgsd"
            ],
            "entry": [
                {
                    "word": "gsdg",
                    "reverse_translation": [
                        "method",
                        "treatment",
                        "recipe",
                        "attitude",
                        "how",
                        "retro"
                    ],
                    "score": 0.000305442198
                },
                {
                    "word": "మార్గము",
                    "reverse_translation": [
                        "way",
                        "route",
                        "road",
                        "entry",
                        "how",
                        "impasse"
                    ],
                    "score": 0.000305442198
                }
            ],
            "base_form": "how",
            "pos_enum": 20
        }
    ],
    "src": "en",
    "server_time": 12
})

where the client should be able to specify the name of the callback function (someCallback) by passing it as a query string parameter.

Then you could perform the cross domain AJAX call:

$.ajax({
    url: 'http://example.com/some_endpoint',
    jsonp: 'callback',
    dataType: 'jsonp',
    data: { firstName: 'john', lastName: 'smith' },
    success: function (result) {
        alert(result);
    },
    error: function (jqxhr, status, errorThrown) {
        alert('Failure, Unable to recieve content : ' + status)
        alert(jqxhr.responseText);
    }
});