How to parse the returned object from "success" callback method in JQuery using AJAX

Question

I have this stadard code for receiving a class from a web service:


function getStuff() {
  var callParams = "{'param1':'" + "oren"  + "'}"
  $.ajax({
  type: "POST",
  url: "http://192.168.5.223:8989/TolunaAPI.asmx/GetDummyType",
  data: callParams,
  contentType: "application/json; charset=utf-8",
  dataType: "json",
  success: function (data) {
    alert(data);
  ....

This give an alert that says: [object Object].
I tried reading some related posts here and on JQuery documentation, but I can't understand what exactly is the "data" object.
What the web service returns is and object named DummyType:


public class DummyType
    {
       public ErrorTypes error;
       public NestedDummyType nested;
       public DummyType() { }
       public DummyType(string paramName)
       {
           error = ErrorTypes.None;
           nested = new NestedDummyType();
       }
    }
}

Which as you see has another object in it, namely NestedDummyType:

public class NestedDummyType
    {
       public string nestedString;
       public int nestedInt;
       public NestedDummyType()
        {
            nestedString = "Hello from nested";
            nestedInt = -1;
        }
    }

All of these are supposed to be returned in json format, but as mentioned, I can't seem to be able to interpret the received data.
How is this done?
Thanks.

Nick Craver · Accepted Answer · 2010-09-07 12:15:53Z

3

You should be able to do this (the .d is because you're in .Net):

alert(data.d.nested.nestedString);

You're accessing the object just as you would in C#, just doing through the properties. The object d is the DummyType you're passing back, so just access the properties on it, the same as they're named in the C# type on the server, that's how they're serialized to the client.

If for some reason I've glossed over something and this doesn't work, remove the .d, but that shouldn't be the case.

answered Sep 7, 2010 at 12:15

Nick Craver

631k138 gold badges1.3k silver badges1.2k bronze badges

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

4 Comments

Oren A Over a year ago

Thanks a lot. Will mark your answer as the correct as soon as I'll be able to. But can you please elaborate on how this works? What does JQuery knows about my .NET objects and how? And can I iterate over my objects to get a generalized solution for printing the object and all it's sub-objects? Thanks again.

Nick Craver Over a year ago

@Oren - when the service responds you get a string (JSON) like this: { "d": { "error": "something", "nested": { "nestedString" : "something", "nestedInt": 0 } } }, so it's a JavaScript object after being parsed on the client (jQuery does this), so that's how it knows :) Yes you can iterate over objects, arrays, etc, it depends on how you send them to the client, but for example of NestedDummyType was a list instead (List<NestedDummyType> nesteds) you could iterate over it like this: $.each(data.d.nesteds, function() { alert(this.nestedString); });

Nick Craver Over a year ago

@Oren - For the generalized printing...I'd use your console (Firebug or Chrome), there are by far the best tools for viewing the response object.

fiberOptics Over a year ago

@NickCraver in my rest service it returs UserSessionDTO object but when I tried to look at the console of chrome, it returns LoginResult:{SessionID..etc} where this LoginResult came from? Can you explain why this happens? I'm sure that I don't have LoginResult class on server side.

Mark Schultheiss · Accepted Answer · 2010-09-07 12:17:10Z

So if you do this:

success: function (data) { 
    alert(data.nestedInt)'
    alert(data.NestedDummyType.nestedString);
...

do you get what you expect?

EDIT: Just in case you have asp.net, the 2.0 and 3.5 return different values in the data and this parse function in the dataFilter will resolve that issue and work with both versions:

   $.ajaxSetup({
        data: "{}",
        datatype: "json",
        type: "POST",
        contentType: "application/json; charset=utf-8",
        dataFilter: function(data)
        {
            var msg;
            if (typeof (JSON) !== 'undefined' &&
                typeof (JSON.parse) === 'function')
                msg = JSON.parse(data);
            else
                msg = eval('(' + data + ')');
            if (msg.hasOwnProperty('d'))
                return msg.d;
            else
                return msg;
        },
        error: function(xhr, textStatus, errorThrown)
        {
  //handle errors
        }
    });

Pierre Henry · Accepted Answer · 2010-09-07 12:19:25Z

1

If your server-side script effectively returns well-formed JSON, jquery will automatically parse it and the data object will contain the parsed object, i.e. your NestedDummyType object. Have you tried to do something like that in your success callback ?

success: function (data) {
    alert(data.nested.nestedString);
    alert(data.nested.nestedInt)
}

answered Sep 7, 2010 at 12:19

Pierre Henry

17.6k23 gold badges90 silver badges109 bronze badges

1 Comment

Pierre Henry Over a year ago

Check Nick's answer, I didn't no about .Net's '.d' object

Jamiec · Accepted Answer · 2010-09-07 12:47:26Z

0

Here's a useful little snippet I use in javascript when I want to find out about an object.

var s = "";
for(x in data)
  s += x + "=" + data[x] + "\r\n";
alert(s);

It will alert all methods/properties of the object data, but is not recursive (so you wouldnt see anything from nested.

edited Sep 7, 2010 at 12:47

answered Sep 7, 2010 at 12:23

Jamiec

136k15 gold badges141 silver badges202 bronze badges

Collectives™ on Stack Overflow

How to parse the returned object from "success" callback method in JQuery using AJAX

4 Answers 4

4 Comments

Comments

1 Comment

Comments

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

4 Comments

Comments

1 Comment

Comments

Related