How to use multiple values with jQuery ajax dataType?

Question

I should request the data as jsonp to perform cross domain request. But actual result returned is json like {"q":"iphone","r":["iphone 5","iphone","обмен на iphone","iphone 4","iphone 5s"]}.

I've tried to use multiple values in dataType like:

$.ajax({
  url: url,
  type: 'GET',
  dataType: 'jsonp json',
  jsonp: false,
  ...

but it returns parsererror (the same as just with jsonp).

I also tried to do the call with and without callback:

$.ajax({
  url: url,
  type: 'GET',
  dataType: 'jsonp json',
  cache: true,
  jsonpCallback: 'callbackFunctionName',
  jsonp: 'callback',

What can I do to process such result correctly?

Upd. I tried to use script instead of jsonp, it works better - success/done function is called (instead of error/fail), but I can not get response text - data passed to success() is undefined as well as jqXHR.responseText passed to complete() is empty.

Have you stumbled upon this: http://stackoverflow.com/questions/5943630/basic-example-of-using-ajax-with-jsonp#answer-14523763 ? — sri, Sep 05 '14 at 11:19
@sri, how `getJSON` can help here? If I would pass it with `?` at the end, believe, it will expect jsonp response as well. — LA_, Sep 05 '14 at 11:23
I think that was just another way of using a `callback`. But as you said you tried both with and without callback, it won't be useful! — sri, Sep 05 '14 at 11:55
May be why not edit the question with only callback you used? — sri, Sep 05 '14 at 11:56

score 1 · Accepted Answer · edited Nov 20 '19 at 17:51

1

You can't use multiple dataTypes, if you use JSONP this will return a JSONP block which you could use to call a callback to handle the return data like this:

Basic example of using .ajax() with JSONP?

You want to return a response formed as a JSONP block which would be something like:

callback({
    "q": "iphone",
    "r": ["iphone 5", "iphone", "обмен на iphone", "iphone 4", "iphone 5s"]
});

From here you can use the callback assuming that you are using the AJAX call with the set callback parameter.

edited Nov 20 '19 at 17:51

informatik01

16,038
10
74
104

answered Sep 05 '14 at 11:06

Adrian Forsius

1,437
2
19
29

Can not I use it with `script` as well? If I use `script` instead of `jsonp`, then `success` function is called (instead of `error`), but I can not get response text - `data` passed to `success()` is undefined as well as `jqXHR.responseText` passed to `complete()` is empty. – LA_ Sep 05 '14 at 11:34
The main problem with my case - server returns pure `json`, not `jsonp` block. So the example given in the linked question also doesn't work. – LA_ Sep 05 '14 at 11:46
You have to form the response as a jsonp block otherwise you will get a string formed as json but which is expected to be a jsonp-block. – Adrian Forsius Sep 05 '14 at 11:58
This is 3rd party server, so I can not change the response. – LA_ Sep 05 '14 at 12:03
Then you can't use JSONP, sorry – Adrian Forsius Sep 05 '14 at 12:37

score 1 · Answer 2 · edited Dec 22 '16 at 19:37

If you need to return multiple datatypes from the URL then there is no need to pass the dataType in jQuery AJAX call.

$.ajax({
        type: "GET",
        url: url,
        data: data,
        //dataType: "json",  comment this line
        cache: false,
        beforeSend: function () {},
        success: function (data) {},
        error: function (xhr, ajaxOptions, errorThrown) {}
      });

score 0 · Answer 3 · answered Jan 05 '21 at 04:47

As mentioned in an earlier post, you can remove the dataType attribute completely. In which case, JQuery Ajax will intelligently guess the output and do the conversion.

https://api.jquery.com/jquery.ajax/ - dataType

make sure that response header – “Content-Type” is text/plain and mimeType is not explicitly provided as part of AJAX options.

ajaxHandleResponses - will automatically try to detect the conversion type based on mimeType and Content-Type header.

function ajaxHandleResponses( s, jqXHR, responses ) {

var ct, type, finalDataType, firstDataType,
    contents = s.contents,
    dataTypes = s.dataTypes;

// Remove auto dataType and get content-type in the process
while ( dataTypes[ 0 ] === "*" ) {
    dataTypes.shift();
    if ( ct === undefined ) {
        ct = s.mimeType || jqXHR.getResponseHeader( "Content-Type" );
    }
}

Another solution is to use custom conversion

Do AJAX custom conversion based on response either to JSON or retain as String if the response is not JSON.

SAMPLE CODE:

            return $.ajax({
                type: "GET",
                url: serviceURL,
                converters: {
                    'text mycustomtype': (result) => {
                        return this.getResponse(result);
                    }
                },
                dataType: 'mycustomtype'
            });

        this.getResponse = (result) => {
            let response;
            try {
                response = JSON.parse(result);
            }
            catch (e) {
                response = result;
            }
            return response;
        };

How to use multiple values with jQuery ajax dataType?

3 Answers3

Linked