Update/Destroy Parameter [new]

[Joel]

I am using the TreeList as defined below.  I can successfully get and display my hierarchy.  However, when I go to update,  the [Group group] is empty like it newed up an instance of the object instead of took it from the tree.  What am I missing?

TreeList Definition:

<script id="photo-template" type="text/x-kendo-template">
    <div class='group-photo'
         style='background-image: url(@Url.Content("~/images/32/building.png"));'></div>
    <div class='group-name'>#: Name #</div>
</script>

<div class="demo-section k-content">
    <h4>Customer Groups</h4>
    @(Html.Kendo().TreeList<GsiPortal.Models.Group>()
          .Name("treelist")
          .Columns(columns =>
          {
              columns.Add().Field(e => e.Name).Width(220).TemplateId("photo-template");
              columns.Add().Field(e => e.DisplayName);
              columns.Add().Field(e => e.Description);
              columns.Add().Field(e => e.AddTimestamp).Width(220).Title("Timestamp").Format("{0:MMMM d, yyyy}");
              columns.Add().Command(c =>
              {
                  c.CreateChild().Text("Add child");
                  c.Edit();
                  c.Destroy();
              })
                  .HtmlAttributes(new
                  {
                      style = "text-align: center;"
                  });
          })
          .Editable(e => e.Mode(TreeListEditMode.InLine))
          .Pageable()
          .Selectable(selectable => selectable.Mode(TreeListSelectionMode.Single))
          .Navigatable()
          .Sortable()
          .Scrollable(true)
          .Filterable()
          .HtmlAttributes(new { style = "height:550px;" })
          .DataSource(dataSource => dataSource
              .PageSize(20)
              .Model(m =>
              {
                  m.Id(f => f.Id);
                  m.ParentId(f => f.ParentId);
                  m.Expanded(true);
                  m.Field(f => f.Name);
                  m.Field(f => f.DisplayName);
                  m.Field(f => f.Description);
                  m.Field(f => f.AddTimestamp).Editable(false);
                  m.Field(f => f.LastActionTimestamp).Editable(false);
              })
              .Create(create => create.Action("CreateJson", "Groups"))
              .Read(read => read.Action("AllJson", "Groups"))
              .Update(update => update.Action("UpdateJson", "Groups"))
              .Destroy(delete => delete.Action("DestroyJson", "Groups"))
          ))

    <style>
        .group-photo {
            display: inline-block;
            width: 40px;
            height: 40px;
            border-radius: 50%;
            background-size: 40px 44px;
            background-position: center center;
            vertical-align: middle;
            line-height: 41px;
            box-shadow: inset 0 0 1px #999, inset 0 0 10px rgba(0,0,0,.2);
        }

        .group-name {
            display: inline-block;
            vertical-align: middle;
            line-height: 41px;
            padding-left: 10px;
        }
    </style>

 

Control Methods

public async Task<JsonResult> AllJson([DataSourceRequest] DataSourceRequest request)
{
    var all = await groupService.GetAllAsync();
    var result = await all.ToTreeDataSourceResultAsync(request,
        e => e.Id,
        e => e.ParentId,
        e => e);

    return Json(result);
}

public async Task<JsonResult> CreateJson([DataSourceRequest] DataSourceRequest request, Group group)
{
    if (ModelState.IsValid)
    {
        customerDbContext.Add(group);
        await customerDbContext.SaveChangesAsync();
    }

    return Json(new[] { group }.ToTreeDataSourceResult(request, ModelState));
}

public async Task<JsonResult> UpdateJson(
    [DataSourceRequest] DataSourceRequest request,
    Group group)
{
    if (ModelState.IsValid)
    {
        customerDbContext.Update(group);
        await customerDbContext.SaveChangesAsync();
    }

    return Json(new[] { group }.ToTreeDataSourceResult(request, ModelState));
}

public async Task<JsonResult> DestroyJson([DataSourceRequest] DataSourceRequest request, Group group)
{
    if (ModelState.IsValid)
    {
        customerDbContext.Group.Remove(group);
        await customerDbContext.SaveChangesAsync();
    }

    return Json(new[] { group }.ToTreeDataSourceResult(request, ModelState));
}

Also, I have attached a picture of the TreeLIst

[Viktor Tachev]

Hello Joel,

I have examined the code and noticed that the Pageable option is enabled for the TreeList. Note that paging in the widget works only client-side. Thus, in order for the paging to work as expected the ServerOperations setting for the DataSource should be set to false. Would you try removing the Pageable and PageSize settings from the configuration and see if that makes a difference.

Also, it seems that async Actions are used. In such scenarios you can use the ToTreeDataSourceResultAsync method instead of ToTreeDataSourceResult.

In case the issue persists please send us a runnable sample where the problematic behavior is replicated. This will enable us to examine the issue locally and look for its cause.


Regards,
Viktor Tachev
Progress Telerik

[Joel]

I have posted a support ticket with an example project.

[Viktor Tachev]

Hello Joel,

Thank you for the project. I have replied in the support ticket, however I will also post the reply here in case someone else is facing similar behavior. 

The argument in the CRUD actions was named group, however that is a reserved word used by the DataSource. In order to have the operations work as expected please rename the argument - for example to groupName. After modifying the code as illustrated in the following snippet that data was passed to the controller as expected.

public async Task<JsonResult> UpdateJson(
    [DataSourceRequest] DataSourceRequest request,
    Group groupName)
{
    if (ModelState.IsValid)
    {
        IEnumerable<Group> match = groups.Where(x => x.Id == groupName.Id);
    }

    return Json(await new[] { groupName }.ToTreeDataSourceResultAsync(request, ModelState));
}

Regards,
Viktor Tachev
Progress Telerik

[Joel]

You would not believe how much time I spent on this.  Its embarrassing.

Is there a way to throw a good error message if the parameter Type doesn't match what you're expecting?  Otherwise, please document this.  Thank you.

[Viktor Tachev]

Hi Joel,

Thank you for the feedback. We will consider updating the documentation so this specific behavior is more clear. 

Regards,
Viktor Tachev
Progress Telerik