Kendo Treeview Binding parent and children - asp.net-mvc

Question

I'm trying to follow this example here
http://docs.telerik.com/kendo-ui/getting-started/using-kendo-with/aspnet-mvc/helpers/treeview/ajax-binding
However, whenever I try to modify their code, I get an error saying
Error 2 'Kendo.Mvc.UI.Fluent.ReadOnlyDataSourceBuilder' does not contain a definition for 'Model' and no extension method 'Model' accepting a first argument of type 'Kendo.Mvc.UI.Fluent.ReadOnlyDataSourceBuilder' could be found (are you missing a using directive or an assembly reference?) c:\Users\Michael\Google Drive\Work\Companies\Clickable Community\dhvs\Clickable Community\Development\Portal\ClickableCommunity.Web\Views\Shared_Layout.cshtml 34 ClickableCommunity.Web
Here is my code
#(Html.Kendo().TreeView()
.Name("treeview")
// The property that specifies the text of the node
.DataTextField("Name")
.DataSource(dataSource => dataSource
.Model(model => model
// The property that uniquely identieis a node.
// The value of this property is the argument of the action method
.Id("Id")
// the boolean property that tells whether a node has children
.HasChildren("HasChildren")
)
.Read(read => read
// The action method which will return JSON
.Action("ReadCats", "Home")
)
)
)
and what I'm doing in my controller
public JsonResult ReadCats()
{
var categories = _entityLogic.GetActiveCategories();
var jsonResult = categories.Select(cat => new
{
Id = cat.Id,
Name = cat.Name,
HasChildren = categories.Where(c => c.ParentCategory == cat.Id).Any(),
ParentId = cat.ParentCategory
}).ToList();
return Json(jsonResult, JsonRequestBehavior.AllowGet);
}
Basically, I have a table that stores and ID, name, and parentcategory (the id of the parent category) and I'm trying to bind a treeview to all my parent child nodes. Thanks in advance.
Edit
So I still cannot get this. I keep getting the same error. I can't put #model namespace because it gives me an error saying it is a namespace but used like a type. Here is my entire code. Thanks,
#model ClickableCommunity.Web.Models.Public.HomeModel
#using ClickableCommunity.Core.Models.Data
#using Kendo.Mvc.UI
#{
ViewBag.Title = "Home Page";
}
<h2>#ViewBag.Message</h2>
#(Html.Kendo().TreeView()
.Name("treeview")
// The property that specifies the text of the node
.DataTextField("Name")
.DataSource(dataSource => dataSource
.Model(model => model
// The property that uniquely identieis a node.
// The value of this property is the argument of the action method
.Id("Id")
// the boolean property that tells whether a node has children
.HasChildren("HasChildren")
)
.Read(read => read
// The action method which will return JSON
.Action("ReadCats", "Home")
)
)
)
<ul>
#foreach (var item in Model.CategoryEntities)
{
<li>
#item.Name
</li>
}
</ul>
And here is my controller
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Web;
using System.Web.Mvc;
using ClickableCommunity.Core.Contracts.Logging;
using ClickableCommunity.Core.Contracts.Logic;
using ClickableCommunity.Web.Models.Public;
namespace ClickableCommunity.Web.Controllers
{
public class HomeController : BaseController
{
private readonly IEntityLogic _entityLogic;
private readonly IGeogrpaphyLogic _geoLogic;
private readonly IUserLogic _userLogic;
public HomeController(ISystemLogger logger, IEntityLogic entityLogic, IUserLogic userLogic, IGeogrpaphyLogic geoLogic) : base(logger)
{
_entityLogic = entityLogic;
_userLogic = userLogic;
_geoLogic = geoLogic;
}
public ActionResult Index()
{
var catEnts = new List<HomeModel.CategoryEntitiesList>();
var model = new HomeModel
{
AvailableCategories = _entityLogic.GetActiveCategories()
, Entities = _entityLogic.GetActiveEntities()
, States = _geoLogic.GetAllStates()
};
var tempCe = new HomeModel.CategoryEntitiesList();
foreach (var i in model.AvailableCategories.Where(c => c.ParentCategory == null))
{
tempCe = new HomeModel.CategoryEntitiesList();
tempCe.Name = i.Name;
tempCe.ParentCategory = i.ParentCategory;
tempCe.Id = i.Id;
tempCe.HasChildren = model.AvailableCategories.Where(a => a.ParentCategory == i.Id).Any();
catEnts.Add(tempCe);
}
model.CategoryEntities = catEnts;
return View(model);
//return View();
}
public ActionResult About()
{
ViewBag.Message = "Your app description page.";
return View();
}
public ActionResult Contact()
{
ViewBag.Message = "Your contact page.";
return View();
}
public JsonResult GetChildTreeViewData(int? id)
{
var categories = _entityLogic.GetActiveCategories();
if (id != null)
{
categories = categories.Where(c => c.ParentCategory == id);
}
var jsonResult = categories.Select(cat => new
{
Id = cat.Id,
Name = cat.Name,
HasChildren = categories.Where(c => c.ParentCategory == cat.Id).Any(),
ParentCategory = cat.ParentCategory
}).ToList();
return Json(jsonResult, JsonRequestBehavior.AllowGet);
}
}
}

Answer 1

Your View should define a Model in order for this to work
Add this line to the top of your View:
#model categories //or whatever namespace your Entity categoies are in
this should work fine!!