Passing an array of Javascript classes to a MVC controller?

Question

I am trying to pass an array of services to my controller. I've tried a bunch of different ways to get it work, serializing the data before going to controller, serializing each service, only thing that seems to work is changing the controller parameter to string and serializing array, then using JsonConvert, but I'd rather not do that.

With the specified code, I am getting the correct number of items in the List, but they all contain a service id with an empty guild, and service provider id is null.

Any ideas?

Javascript


function ServiceItem() {
    this.ServiceProviderID = 'all';
    this.ServiceID = '';
}

var selecteditems= (function () {

    var services = new Array();

    return {
       all: function() { 
           return services; 
       },
       add: function(service) {
           services.push(service);
       }
    };

})();

var reserved = [];
$.each(selecteditems.all(), function(index, item){
   reserved.push({ ServiceID: item.ServiceID, ServiceProviderID: item.ServiceProviderID});
});

getData('Controller/GetMethod', { items: reserved }, function(result) {
});

var getData = function (actionurl, da, done) {
       $.ajax({
           type: "GET",
           url: actionurl,
           data: da,
           dataType: "json",
           async: true,
           success: function (d) {
               if (typeof (done) == 'function') {
                   var str = JSON.stringify(d);
                   done(JSON.parse(str));
               }
           }
       });
};

Controller

public JsonResult GetMethod(List<CustomObject> items)
{
}

Custom Object

public class CustomObject
{
   public Guid ServiceID {get;set;}
   public Guid? ServiceProviderID {get;set;}
}

PSL · Accepted Answer · 2013-05-29T22:29:51.110

3

Set the content-type and use POST instead of GET (as it is a list of complex type objects). mark your action with HttpPost attribute too.

See if this works:-

 $.ajax({
           type: "POST",
           url: actionurl,
           data: JSON.stringify(da),
           dataType: "json",
           contentType: 'application/json',
           async: true,
           success: function (d) {
               if (typeof (done) == 'function') {
                   var str = JSON.stringify(d);
                   done(JSON.parse(str));
               }
           }
       });

edited May 29 '13 at 22:29

answered May 29 '13 at 22:15

PSL

123,204
21
253
243

getData is actually a method I use for all of my database calls.. but I was passing { items: reserved } to it.. – jaekie May 29 '13 at 22:20
traditional:true, makes list contain 0 rows, was 2 rows before but empty values – jaekie May 29 '13 at 22:22
@csharpdev probably because of the complex object type use POST instead of GET. – PSL May 29 '13 at 22:26
kodos, it worked... changed to a POST, didnt even think of that! – jaekie May 29 '13 at 22:42
@csharpdev GET will work for simple types. like list or ints etc.. but might not work for complex types. you can see in the url how the data goes while using get. – PSL May 29 '13 at 22:43

Passing an array of Javascript classes to a MVC controller?

1 Answers1

Linked