1

I am finding it difficult to understand how the hierarchy is binded in the TreeList. We are trying to achieve InCell editing and I am unable to do it using the HTML MVC wrappers.

Please help me with the working solution as the one on the How to website does not give an insight on how the DB schema and am unable to debug it to understand how to structure the Model.

  1. https://docs.telerik.com/aspnet-mvc/helpers/treelist/editing

Code snippets: I hope this helps:

Html Markup:


@(Html.Kendo().TreeList<ABC.Areas.COManager.ViewModels.MaterialViewModel>()
                                              .Name("treelist")
                  .Toolbar(toolbar =>
                  {
                                                                                          //toolbar.Create().Name("Add Item to order");
                                                                                          toolbar.Save();
                      toolbar.Cancel();
                  })
         .Columns(columns =>
         {
             columns.Add().Field(e => e.OrderItemId).Title("Item id").Expandable(true);//.Width(220);
                                                                                 columns.Add().Field(e => e.OrderSubItemId).Title("Sub item id");//.Width(220);
                                                                                 columns.Add().Field(e => e.WBS).Title("WBS");//.Width(220);
                                                                                 columns.Add().Field(e => e.Rate).Title("Rate");//.Width(100);
                                                                                 columns.Add().Field(e => e.Hours);
             columns.Add().Field(e => e.CostAmount).Title("Cost Amount").Format("{0:C2}");
             columns.Add().Command(c =>
             {
                 c.CreateChild().Text("Add Item detail");
                 c.Destroy();
             }
);//.Width(240);
                                                                             })
.Events(ev => ev.DataBound("onDataBound"))
.Editable(e => e.Mode(TreeListEditMode.InCell))
.DataSource(dataSource => dataSource
.Batch(true)
.Read(read => read.Action("All_InCell", "OrderInputs"))
.Create(create => create.Action("Create_InCell", "OrderInputs").Type(HttpVerbs.Post))
.Update(update => update.Action("Update_InCell", "OrderInputs").Type(HttpVerbs.Post))
.Destroy(delete => delete.Action("Destroy_InCell", "OrderInputs").Type(HttpVerbs.Post))
.Model(m =>
{
m.Id(f => f.OrderSubItemId);
m.ParentId(f => f.OrderItemId);
//m.Expanded(true);
m.Field(f => f.OrderId);
m.Field(f => f.OrderItemId);
m.Field(f => f.OrderSubItemId);
m.Field(f => f.WBS);
m.Field(f => f.Rate);
m.Field(f => f.Hours);
m.Field(f => f.CostAmount).DefaultValue(0);
})
)
                //.Height(540)

        )



Controller action for read:

public JsonResult All_InCell([DataSourceRequest] DataSourceRequest request)
        {
            var result = GetDirectory().ToTreeDataSourceResult(request,
                e => e.OrderSubItemId,
                e => e.OrderItemId,
                e => new MaterialViewModel
                {
                    OrderItemId = e.OrderItemId,
                    OrderId = e.OrderId,
                    OrderSubItemId = e.OrderSubItemId,
                    OrderDate = e.OrderDate,
                    hasChildren = false
                }
            );

            return Json(result, JsonRequestBehavior.AllowGet);
        }



Gets the Data:

private IEnumerable<MaterialViewModel> GetDirectory()
        {
            return employeeDirectory.GetAll();
        }



Returns the data (Dummy/Static): Could this be the problem? I am unsure.


   internal IEnumerable<MaterialViewModel> GetAll()
        {
            var returnData = new List<MaterialViewModel>();
            for (var i = 0; i <= 10; i++)
            {
                returnData.Add(new MaterialViewModel { OrderId = i + 1, OrderItemId = (10 * (i + 1)) + (i + 1), OrderSubItemId = (100 * (i + 1)) + (i + 1), OrderDate = DateTime.Now, WBS = "ABC" + (i + 1).ToString(), Description = "Description " + (i + 1).ToString(),  });
            }
            return returnData;
        }




Model:

MaterialViewModel


public class MaterialViewModel: OrderInputsViewModel
    {
        public string WBS { get; set; }

        public string Description { get; set; }

        public double Rate { get; set; }

        public int Hours { get; set; }

        public double CostAmount { get; set; }
    }



Model:

OrderInputsViewModel


    public class OrderInputsViewModel
    {
        //[ScaffoldColumn(false)]
        public int? OrderId { get; set; }

        //[ScaffoldColumn(false)]
        public int OrderItemId { get; set; }

        public int OrderSubItemId { get; set; }

        public DateTime OrderDate { get; internal set; }

        //[ScaffoldColumn(false)]
        public bool hasChildren { get; set; }


    }

Expected is to have a TreeList populated by the Model class and be able to create children in the loaded items.

Dikshaant
  • 11
  • 4

1 Answers1

0

Answered by the Progress Telerik support team. Sharing the resolution here in anticipation that it could help any future readers.

Ans - Perhaps the issue I was experiencing is that there is no data in the TreeList. The cause is that the ParentId is not nullable and that there are no root items - items with a ParentId which is null. Making the following two changes, I am able to see the TreeList rendered correctly:

Model which is bonded to the TreeList:

public class OrderInputsViewModel
 {
   //Parent Id
   **public int? OrderItemId { get; set; }**

Method that returns the data (Dummy/Static):

returnData.Add(new MaterialViewModel {
   OrderId =i + 1 ,
   OrderItemId = i % 2 == 0 ? (10 * (i + 1)) + (i + 1) 
**: (int?)null**,
   OrderSubItemId = (100 * (i + 1)) + (i + 1),
   OrderDate = DateTime.Now,
   WBS = "ABC" + (i + 1).ToString(),
   Description = "Description " + (i + 1).ToString()
});
Dikshaant
  • 11
  • 4