I have a grid of model with subset collection property like this:

    public partial class MenuGroup
    {
        public MenuGroup()
        {
            Item = new HashSet<Item>();
        }

        public int Id { get; set; }
        public string Label { get; set; }

        public virtual ICollection<Item> Item { get; set; }
    }

When the `Item` subsets are empty the grid displays without problems.

When the subsets have any items (eg. `Count > 0`) the grid breaks and does not display any records.

My grid:

            @(Html.Kendo().Grid<MenuGroup>().Name("menu")
                  .Columns(columns =>
                  {
                      columns.Bound(c => c.Label);
                      columns.Command(cmd => cmd.Edit());
                  })
                  .DataSource(dataSource => dataSource
                      .Ajax()
                      .Model(model => model.Id(m => m.Id))
                      .Read(read => read.Action("Read", "Menu"))
                  )
                  .ToolBar(x=>x.Create())

                  .Pageable()
                  .Sortable()
            )

I am using Entity Framework to populate the menu:

        public async Task<ActionResult> Read([DataSourceRequest]DataSourceRequest request)
        {
            var model = _menuRepository.GetMenuWithItems();

            return Json(model.ToDataSourceResult(request), new JsonSerializerSettings { ContractResolver = new DefaultContractResolver() });
        }

This is my repository:


        public IEnumerable<MenuGroup> GetMenuWithItems()
        {
            try
            {
                var model = _context.MenuGroup.Include(m => m.Item);
                //var model = _context.MenuGroup; // This set (without items) displays well)

                return _context.MenuGroup.Include(m => m.Item);
            }
            catch (Exception err)
            {
                throw new Exception("Error getting the menus: " + err);
            }
        }