jQuery parse JSON in .done() functions

Question

I know that there is a shortcut to parse JSON with jQuery such as

$.post('myPhpFile.php', postData, function(data){
   console.log(data.status) // "OK"
},'json');

But I really hate anon functions and I also really hate having to manually parse JSON each time. I was hoping I could do this (because I don't always do the same thing with the same data)

function getSomeData(phpFile, postData){
   return $.post(phpFile, postData);
}

getSomeData.done(function(data){
   console.log(data.status) // error, as is not JSON   
},'json');

But in the .done() I have to $.parseJSON(data) first, and I have lots of these small functions that juts return $.posts.

Is there any other shortcut or nice functional way to still return the deferred object of $.post and have the data already parsed in json? I thought of

function getSomeData(phpFile, postData){
    var defer = $.Deferred();
    $.post(phpFile, postData, function(data){
      defer.resolve(data);
   },'json');
   return defer.promise(data);
}

But I am OCD and now i have two deferreds. Just curious if there's a better way.

yes, there's a better way. Creating extra deferred objects is a common jQuery promise anti-pattern. — Alnitak
– Alnitak, Commented Apr 16, 2015 at 15:34
Note: in the 2nd snippet, getSomeData isn't being invoked. .done() would be used as a method of the function itself, rather than its return value. Is this a typo? — Jonathan Lonowski
– Jonathan Lonowski, Commented Apr 16, 2015 at 15:35

Alnitak · Accepted Answer · 2015-04-16 15:37:38Z

1

If you want to pass the json dataType field, but want to use Promises instead of the anonymous callback, just pass null for the callback.

From the docs:

A callback function that is executed if the request succeeds. Required if dataType is provided, but can be null in that case

Hence all you need is:

function getSomeData(phpFile, postData) {
    return $.post(phpFile, postData, null, 'json');
}

Of course if your server is responding with the appropriate Content-type: field then JQuery will happily just guess at the data type anyway.

edited Apr 16, 2015 at 15:37

answered Apr 16, 2015 at 15:32

Alnitak

341k72 gold badges420 silver badges503 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Kyeotic · Accepted Answer · 2015-04-16 15:37:20Z

1

If you are just looking to wrap up the parameters and return an object you can chain into, wrap up a standard ajax call

function post(phpFile, postData){
    return $.ajax({
      type: "POST",
      url: phpFile,
      data: postData,
      dataType: 'json'
    });
}

post('myPhpFile.php', postData,).done(function(function(data){
   console.log(data.status)
});

answered Apr 16, 2015 at 15:37

Kyeotic

19.9k12 gold badges73 silver badges133 bronze badges

6 Comments

tdoakiiii Over a year ago

Duh... Getting so used to the convenience functions, forgot about the originals.

Alnitak Over a year ago

@tdoakiiii $.post will still do what you want perfectly happily, though.

Kyeotic Over a year ago

@Alnitak Yes, using a null callback will work. I just don't like the way it looks.

Alnitak Over a year ago

@Tyrsius well, that's just being needlessly fussy, IMHO ;-)

Kyeotic Over a year ago

@Alnitak I suppose; though "making the code look nice" is half of what this site is about =)

|

Collectives™ on Stack Overflow

jQuery parse JSON in .done() functions

2 Answers 2

Comments

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related