jquery - WebMethod returning JSON but the response obj in my $.ajax() callback is only a string

Question

Here is my home-made Serializing class:

public class JsonBuilder
{
    private StringBuilder json;

    public JsonBuilder()
    {
        json = new StringBuilder();
    }

    public JsonBuilder AddObjectType(string className)
    {
        json.Append(""" + className + "": {");
        return this;
    }

    public JsonBuilder Add(string key, string val)
    {
        json.AppendFormat(""{0}":"{1}",", key, val);
        return this;
    }

    public JsonBuilder Add(string key, int val)
    {
        json.AppendFormat(""{0}":{1},", key, val);
        return this;
    }

    public string Serialize()
    {
        return json.ToString().TrimEnd(new char[] { ',' }) + "}";
    }
}

Here is the Web Method

[WebMethod]
public static string GetPersonInfo(string pFirstName, string pLastName)
{
    var json = new JsonBuilder().AddObjectType("Person");
    json.Add("FirstName", "Psuedo" + pFirstName).Add("LastName", "Tally-" + pLastName);
    json.Add("Address", "5035 Macleay Rd SE").Add("City", "Salem");
    json.Add("State", "Oregon").Add("ZipCode", "97317").Add("Age", 99);
    return json.Serialize();
}

The Ajax call client-side

 $.ajax(
   {
       type: "POST",
       url: "Default.aspx/GetPersonInfo",
       data: JSON.stringify(name),
       contentType: "application/json; charset=uft-8",
       dataType: "json",
       success: function (rsp) { SetPerson(rsp); },
       error: function (rsp)
       {
           alert(rsp);
       }
   });

And finally, my callback method

function SetPerson(rsp)
{
    $('#fName').val(rsp.d.FirstName);
    $('#lName').val(rsp.d.LastName);
    $('#address').val(rsp.d.Address);
    $('#city').val(rsp.d.City);
    $('#state').val(rsp.d.State);
    $('#zip').val(rsp.d.ZipCode);
    SetPerson(rsp.d.Age);
}

rsp.d is a string that contains all the properties ... the properties themselves are undefined. I know I am missing something simple here.

Returned string from server

"Person": {"FirstName":"Psuedomatt","LastName":"Tally-cox","Address":"5035 Macleay Rd SE","City":"Salem","State":"Oregon","ZipCode":"97317","Age":99}

Answer 1

You shouldn't manually serialize the return value; ASP.NET will do it for you. Try something like this:

[WebMethod]
public static Person GetPersonInfo(string pFirstName, string pLastName)
{
  // Assuming you have a server-side Person class.
  Person p = new Person();

  p.FirstName = "Pseudo" + pFirstName;
  p.LastName = "Tally-" + pLastName;
  p.Address = "5035 Macleay Rd SE";
  p.City = "Salem";
  p.State = "Oregon";
  p.ZipCode = "97317";

  // ASP.NET will automatically JSON serialize this, if you call it with
  //  the correct client-side form (which you appear to be doing).
  return p;
}

If you need to return something more dynamic, like your example seems to be doing, you can use an anonymous type:

[WebMethod]
public static object GetPersonInfo(string pFirstName, string pLastName)
{
  // ASP.NET will automatically JSON serialize this as well.
  return new {
    FirstName = "Pseudo" + pFirstName,
    LastName = "Tally-" + pLastName,
    Address = "5035 Macleay Rd SE",
    City = "Salem",
    State = "Oregon",
    ZipCode = "97317"
  }
}