I am attempting to send a complex data structure to my server-side method using jQuery.
Below is the C# class structure that I am working with:
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 have an idea of what the correct JSON format should look like. It would be as follows:
[
{
"EmpID":1,
"Name":"Keith",
"BirthDate":"\/Date(947874600000)\/",
"Address":[{"Address1":"Salt lake","Address2":"Kolkata","PostCode":"784512"}],"Salary":5200
}
Here is my approach for sending data from the client to the server side in JavaScript:
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;
});
});
However, I encountered an error where JSON.stringify() did not generate the correct JSON format. I am seeking guidance on the best way to programmatically populate and generate the right JSON data without manual intervention.
Please advise me on how to dynamically generate the correct JSON data using JavaScript for seamless deserialization at the server-side. Thank you.
I have restructured my code according to Naveen's suggestion:
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 believe this revised approach will work. Do you agree?
If my class structure were modified as shown below:
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; }
}