What's the best way to send an array of objects from javascript to a webservice?

I have these 2 "classes" functions in my javascript:

// product class
function Product() {
 this.id;
 this.qty;
 this.size;
 this.option;
}

// room class
function Room() {
 this.id;
 this.type;
 this.products = [];
}

      

I have my js logic that populates rooms and their products.

Now I want to send an array of rooms to a web service to do some calculations and get the result from it.

How do I send these array objects to the service and what is the data type that the service will receive for processing and processing?

I tried to write javascript code like this:

        $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            url: "_Services/MyWebService.asmx/CalculatePrices",
            data: "{'rooms':'" + roomsObjects + "'}",
            dataType: "json",
            success: function(result) {
                alert(result.d);
            }
        });

      

And a web service like this:

[WebMethod]
    public string CalculatePrices(object rooms)
    {
        return "blabla";
    }

      

but I find that rooms in wbservice are always = [Object]

+2


source to share


3 answers


In this case, this will work:

//...
   data : '{"rooms":[' + roomsObjects.join() + ']}',
//...

      



The above code will generate a valid JSON string, but I recommend you get the JSON library and use the JSON.stringify function:

      $.ajax({
              type: "POST",
              contentType: "application/json; charset=utf-8",
              url: "_Services/MyWebService.asmx/CalculatePrices",
              data: JSON.stringify({'rooms': roomsObjects}),
              dataType: "json",
              success: function(result) {
                 alert(result.d);
              }
      });

      

+3


source


If you don't mind including a tiny JavaScript library, I think using json2.js' JSON.Stringify is the best way to serialize objects for use with ASP.NET AJAX services .

Here's a snippet of that post:

// Initialize the object, before adding data to it.
//  { } is declarative shorthand for new Object().
var NewPerson = { };

NewPerson.FirstName = $("#FirstName").val();
NewPerson.LastName = $("#LastName").val();
NewPerson.Address = $("#Address").val();
NewPerson.City = $("#City").val();
NewPerson.State = $("#State").val();
NewPerson.Zip = $("#Zip").val();

// Create a data transfer object (DTO) with the proper structure.
var DTO = { 'NewPerson' : NewPerson };

$.ajax({
  type: "POST",
  contentType: "application/json; charset=utf-8",
  url: "PersonService.asmx/AddPerson",
  data: JSON.stringify(DTO),
  dataType: "json"
});

      



There is no array in this example, but JSON.Stringify serializes JavaScript arrays in the correct format for sending to ASP.NET AJAX services for array and list parameters.

The good thing about using JSON.Stringify is that in a browser that supports native JSON serialization (FF 3.5, IE 8, Safari and Chrome nightly builds), it automatically takes advantage of native browser programs instead of using JavaScript. browsers it gets an automatic speed boost.

+2


source


Edit:

data: "{'rooms':'" + roomsObjects + "'}",

      

in

data: {'rooms':roomsObjects},

      

0


source







All Articles