How to pass a JSON object using Ajax using ASP.NET WebMethod

Question

I have a problem with passing a JSON object using Ajax and ASP.NET WebMethods

function setStudentInfo() { var jsonObjects = [ { id: 1, name: "mike" }, { id: 2, name: "kile" }, { id: 3, name: "brian" }, { id: 1, name: "tom" } ]; $.ajax({ type: "POST", url: "ConfigureManager.aspx/SetStudentInfo", contentType: "application/json; charset=utf-8", dataType: "json", async: false, data: { students: JSON.stringify(jsonObjects) }, success: function (result) { alert('success'); }, error: function (result) { alert(result.responseText); } }); } 

ASP.NET Code

 [WebMethod] public static void SetStudentInfo(object students) { //Here I want to iterate the 4 objects and to print their name and id } 

I get the following error:

"{" Message ":" Invalid JSON primitive: students. "," StackTrace ":" in System.Web.Script.Serialization.JavaScriptObjectDeserializer.DeserializePrimitiveObject () in System.Web.Script.Serialization.JavaScriptObjectDeserializer.DeserializeInternal (Int32 depth) in System.Web.Script.Serialization.JavaScriptObjectDeserializer.Berial line input, Int32 depthLimit, JavaScriptSerializer serializer) in System.Web.Script.Serialization.JavaScriptSerializer.Deserialize (JavaScript serializer, line input, type type, Int32 depthLimit) in System.Web.Script.Serialization.JavaScriptSerializer.Deserialize [T] ( string input) in System.Web.Script.Services.RestHandler.GetRawParamsFromPostRequest (HttpContext context, JavaScriptSerializer serializer) in System.Web.Script.Services.RestHandler.GetRawParams (WebServiceMethodDataData method, HttpContext context). Script.Services.RestHandler.ExecuteWebServiceCall (HttpContext context, WebServiceMethodData methodData method) "," ExceptionType ":" System.ArgumentException "}"

Answer 1

Pass all JSON as a string, for example:

data: '{variable: "value"}'

I always get an error message if I try to pass it on as it is.

Answer 2

You get this error because one object is expected, but your code expects a list of objects. Sometimes it can be a little tricky. To simplify data transfer, you must create a class with properties for the type of object that you want to pass to WebMethod, because for ASP.NET it is easier to parse. For instance:

 public class Student { private string _name; private int _id; public string name { get { return _name; } set { _name = value; } } public int id { get { return _id; } set { _id = value; } } } 

And then your WebMethod will change to accept a list of student-class objects, for example:

 [WebMethod] public static void SetStudentInfo(List<Student> Students) { foreach (Student s in Students) { //Do whatever here System.Console.WriteLine(s.name); } } 

Then all you have to do is slightly modify your Ajax call as follows:

 function setStudentInfo() { var jsonObjects = [ { id: 1, name: "mike" }, { id: 2, name: "kile" }, { id: 3, name: "brian" }, { id: 1, name: "tom" } ]; $.ajax({ type: "POST", url: "ConfigureManager.aspx/SetStudentInfo", contentType: "application/json; charset=utf-8", dataType: "json", async: false, data: { Students: JSON.stringify(jsonObjects) }, success: function (result) { alert('success'); }, error: function (result) { alert(result.responseText); } }); } 

Answer 3

I know his old question, but if someone gets an answer here for this solution,

 var jsonObjects=[ { id: 1, name: "mike" }, { id: 2, name: "kile" }, { id: 3, name: "brian" }, { id: 1, name: "tom" } ]; $.ajax({ type: "POST", url: "ConfigureManager.aspx/SetStudentInfo", contentType: "application/json; charset=utf-8", dataType: "json", async: false, data: JSON.stringify({ students: jsonObjects }), success: function (result) { alert('success'); }, error: function (result) { alert(result.responseText); } }); 

Answer 4

Try this code:

 function setStudentInfo() { var jsonObjects = {"students" : [ { id: 1, name: "mike" }, { id: 2, name: "kile" }, { id: 3, name: "brian" }, { id: 1, name: "tom" } ]}; $.ajax({ type: "POST", url: "ConfigureManager.aspx/SetStudentInfo", contentType: "application/json; charset=utf-8", dataType: "json", async: false, data: JSON.stringify(jsonObjects), success: function (result) { alert('success'); }, error: function (result) { alert(result.responseText); } }); 

}

Answer 5

In fact, you are not sending json to the server to send json just to pass the json string for the data property.

 data: JSON.stringify(jsonObjects),