Posting a nested collection to the web interface

I am trying to send a complex type object to web api. On the web api side, when a method receives an object parameter, every property is set correctly, except for the collection that is obtained from ICollection.

Here are my examples:

public class MyClass
{
    private int id;

    public int Id
    {
        get { return id; }
        set { id = value; }
    }

    private MyCollection<string> collection;

    public MyCollection<string> Collection
    {
        get { return collection; }
        set { collection = value; }
    }
}

public class MyCollection<T> : ICollection<T>
{
    public System.Collections.Generic.List<T> list;

    public MyCollection()
    {
        list = new List<T>();
    }

    public void Add(T item)
    {
        list.Add(item);
    }

    public void Clear()
    {
        list.Clear();
    }

    public bool Contains(T item)
    {
        return list.Contains(item);
    }

    public void CopyTo(T[] array, int arrayIndex)
    {
        list.CopyTo(array, arrayIndex);
    }

    public int Count
    {
        get { return list.Count; }
    }

    public bool IsReadOnly
    {
        get { return false; }
    }

    public bool Remove(T item)
    {
        list.Remove(item);
        return true;
    }

    public IEnumerator<T> GetEnumerator()
    {
        return list.GetEnumerator();
    }

    System.Collections.IEnumerator System.Collections.IEnumerable.GetEnumerator()
    {
        return list.GetEnumerator();
    }
}

      

        
        
        
      

    

Here is my api controller:

public class ValuesController : ApiController
{
    // GET api/values
    public IEnumerable<string> Get()
    {
        return new string[] { "value1", "value2" };
    }

    // GET api/values/5
    public string Get(int id)
    {
        return "value";
    }

    // POST api/values
    public string Post([FromBody]MyClass value)
    {
        return "The object has " + value.Collection.Count + " collection item(s).";
    }

    // PUT api/values/5
    public void Put(int id, [FromBody]string value)
    {
    }

    // DELETE api/values/5
    public void Delete(int id)
    {
    }
}

      

        
        
        
      

    

Here is my client side testing method:

        function Test() {
        var obj = {
            'Id': '15',
            'Collection': [{
                '': 'item1'
            }, {
                '': 'item2'
            }]
        };
        $.post(serviceUrl, obj)
        .done(function (data) {
            alert(data);
        });

      

        
        
        
      

    

In Web Api post method becomes 15, but collection length is 0.

But when I change the collection type to ICollection from MyCollection. Collection length 2.

Why am I getting a zero-length collection when I use MyCollection? It is not right? How can I get it to work?