Question

i am trying to post complex data structure to my server side method with jquery.

here i am giving my c# class structure

public partial class SerializeJSON : System.Web.UI.Page
{

    [System.Web.Services.WebMethod]
    public static string GetData(List<Customer> oCust)
    {
        int empid = oCust[0].EmpID;
        string name = oCust[0].Name.ToString();
        DateTime dob = oCust[0].BirthDate;
        double sal = oCust[0].Salary;
        Address add = oCust[0].Address[0];
        return "";
    }
}

public class Customer
{
     List<Address> add = null;
     public Customer()
     {
         add = new List<Address>();
     }

    public int EmpID { get; set; }
    public string Name { get; set; }
    public DateTime BirthDate { get; set; }

    public List<Address> Address
    {
        get { return add; }
        set { add = value; }
    }
    public double Salary { get; set; }
}

public class Address
{
    public string Address1 { get; set; }
    public string Address2 { get; set; }
    public string PostCode { get; set; }
}

i know that how right json would look like. the right json would be

[
{
    "EmpID":1,
    "Name":"Keith",
    "BirthDate":"\/Date(947874600000)\/",
    "Address":[{"Address1":"Salt lake","Address2":"Kolkata","PostCode":"784512"}],"Salary":5200
}

]

here i am telling you how to send data actually from my client to server side
this my javascript code by which i am populating data at client side and late i am sending this like

 var Person = {};
    Person["EmpID"] = 1;
    Person["Name"] = "Keith";
    Person["BirthDate"] = "08/15/2011";

    var Address = {};
    Address["Address1"] = "Salt lake";
    Address["Address2"] = "Kolkata";
    Address["PostCode"] = "741258";

    Person["Address"] = Address;

$(function () {
        $('#btnSubmit').click(function () {
            alert(JSON.stringify(Person));
            $.ajax({
                type: "POST",
                url: "SerializeJSON.aspx/GetData",
                data: "{'oCust':'" + JSON.stringify(Person) + "'}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (data) {
                }
                ,
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    alert(textStatus);
                }
            });
            return false;
        });
    });

but i am getting error. JSON.stringify() not generating correct json.
so please tell me what would be the best approach to populate & generate right json data programatically. one thing i need to say that i dont want to generate json manually rather show me the way to generate right json programatically.

so guide me how to generate right json programatically with javascript.

also tell my approach like to populate data with javascript was wrong.

 var Person = {};
    Person["EmpID"] = 1;
    Person["Name"] = "Keith";
    Person["BirthDate"] = "08/15/2011";

    var Address = {};
    Address["Address1"] = "Salt lake";
    Address["Address2"] = "Kolkata";
    Address["PostCode"] = "741258";

    Person["Address"] = Address;

the above code is wrong approach.

so please guide me how to generate right json with javascript which can be easily deserialize at server side. thanks

Here i restructure my code according to naveen

var Persons = [];

var Person = {};
Person[“EmpID”] = 1;
Person[“Name”] = “Keith”;
Person[“BirthDate”] = “08/15/2011”;

var Address = [];
var addr = {};
addr[“Address1”] = “Salt lake”;
addr[“Address2”] = “Kolkata”;
addr[“PostCode”] = “741258”;
Address.push(addr);

Person["Address"] = Address;
Persons.push(Person)

var DTO = { oCust : Persons }
data: JSON.stringify( DTO )

i hope now it will work….isn’t it?

var Persons = [];

var Person = {};
Person[“EmpID”] = 1;
Person[“Name”] = “Keith”;
Person[“BirthDate”] = “08/15/2011”;

var Address = [];
var addr = {};
addr[“Address1”] = “Salt lake”;
addr[“Address2”] = “Kolkata”;
addr[“PostCode”] = “741258”;
Address.push(addr);

Person["Address"] = Address;

var DTO = { oCust : Person }
data: JSON.stringify( DTO )

am i right?

if my class structure would be like below one

public partial class SerializeJSON : System.Web.UI.Page
{

    [System.Web.Services.WebMethod]
    public static string GetData(Customer oCust)
    {
        int empid = oCust.EmpID;
        string name = oCust.Name.ToString();
        DateTime dob = oCust.BirthDate;
        double sal = oCust.Salary;
        Address add = oCust.Address[0];
        return "";
    }
}

public class Customer
{
     List<Address> add = null;
     public Customer()
     {
         add = new List<Address>();
     }

    public int EmpID { get; set; }
    public string Name { get; set; }
    public DateTime BirthDate { get; set; }

    public List<Address> Address
    {
        get { return add; }
        set { add = value; }
    }
    public double Salary { get; set; }
}

public class Address
{
    public string Address1 { get; set; }
    public string Address2 { get; set; }
    public string PostCode { get; set; }
}

then my json would look like

Answer 1

This is a snippet on auto de-serializing complex JSON using a WebMethod.
Please go through the comments in case of doubts.

Class

public class Customer
{
    public int EmpID { get; set; }
    public string Name { get; set; }
    public DateTime BirthDate { get; set; }

    // why did you use the conventional get set in this case?
    // feel free to revert if you are using the class elsewhere. 
    public List<Address> Address { get; set; }
    public double Salary { get; set; }
}

public class Address
{
    public string Address1 { get; set; }
    public string Address2 { get; set; }
    public string PostCode { get; set; }
}

WebMethod

[System.Web.Services.WebMethod]
public static string GetData(Customer oCust)
{
    try
    {
        int empid = oCust.EmpID;
        string name = oCust.Name.ToString();
        DateTime dob = oCust.BirthDate;
        double sal = oCust.Salary;
        Address add = oCust.Address[0];
        return "Success";
    }
    catch (Exception exception)
    {
        //Elmah.ErrorSignal.FromCurrentContext().Raise(exception);
        return "Failed";
    }
}

AJAX Call

$(function () {
    $('#btnSubmit').click(function (evt) {
        var Person = {};
        Person["EmpID"] = 1;
        Person["Name"] = "Keith";
        //converting to date is not mandatory, but its more typesafe
        Person["BirthDate"] = new Date("08/15/2011");

        var Address = [];
        var addr = {};
        addr["Address1"] = "Salt lake";
        addr["Address2"] = "Kolkata";
        addr["PostCode"] = "741258";
        Address.push(addr);

        Person["Address"] = Address;

        var DTO = { oCust: Person }
        //save yourself some typing. dataType and charset in content type are not needed.
        //Courtesy: http://encosia.com/save-yourself-some-typing-when-you-call-asp-net-services/
        $.ajax({
            type: "POST",
            url: "SerializeJSON.aspx/GetData",
            data: JSON.stringify(DTO),
            contentType: "application/json",
            success: function (msg) {
                //ASP.NET 2.0 fallback.
                var data = msg.hasOwnProperty("d") ? msg.d : msg;
                //place a div with id=content to show the result.(not mandatory)
                $("#content").hide().html(msg.d).delay(1000).show(400);
            },
            error: function (xhr, textStatus, errorThrown) {
                //you should ideally call the xhr.responseText to see the error
                alert(xhr.responseText);
            }
        });
        evt.preventDefault();
    });
});

HTML

<div id="content"></div>
<asp:Button ID="btnSubmit" runat="server" Text="Submit"/>

Hope this helps.