Binding to Model property

[Joel]

I have a Group object that has an [int Status] property.  I get a list of Status values from a Lookup object that has a Name and an EnumIndex value.  The Status value needs to be set from the selected Lookup object's EnumIndex value.  Form & Drop down definition:

Groups are defined in TreeList:

@(Html.Kendo().TreeList<GsiPortal.Models.Group>()
              .Name("treelist")
              .Columns(columns =>
              {
                  columns.Add().Field(e => e.Name).Width(220).TemplateId("icon-template");
                  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"); }).HtmlAttributes(new {style = "text-align: center;"});
                  columns.Add().Command(c => { c.Edit(); }).HtmlAttributes(new { style = "text-align: center;" });
                  columns.Add().Command(c => { c.Destroy(); }).HtmlAttributes(new { style = "text-align: center;" });
              })
              .Editable(e => e.Mode(TreeListEditMode.PopUp).TemplateName("GroupEdit"))
              .Selectable(selectable => selectable.Mode(TreeListSelectionMode.Single))
              .DataSource(dataSource => dataSource
                  .ServerOperation(false)
                  .Create(create => create.Action("CreateJson", "Groups"))
                  .Read(read => read.Action("AllJson", "Groups")
                      .Data("groupsRead"))
                  .Update(update => update.Action("UpdateJson", "Groups"))
                  .Destroy(delete => delete.Action("DestroyJson", "Groups"))
                  .Model(m =>
                  {
                      m.Id(f => f.Id);
                      m.ParentId(f => f.ParentId);
                      m.Expanded(true);
                      m.Field(f => f.Name);
                      m.Field(f => f.Description);
                      m.Field(f => f.AddTimestamp).Editable(false);
                  })
              ))

<script>
    var groupId = Number(@(ViewBag.GroupId));

    function groupsRead() {
        return { id: groupId };
    }

</script>

 

Editing is done in this PopUp:

@model GsiPortal.Models.Group

<div class="container-fluid">
    <div class="col-xs-offset-1">
        <h4>Group</h4>
        <form class="form-horizontal" asp-action="Edit" asp-controller="Groups">
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
            <input type="hidden" asp-for="Id" />
            <div class="form-group">
                <label asp-for="Name" class="control-label"></label>
                <input asp-for="Name" class="form-control" />
                <span asp-validation-for="Name" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Description" class="control-label"></label>
                <input asp-for="Description" class="form-control" />
                <span asp-validation-for="Description" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="ImageUrl" class="control-label"></label>
                <input asp-for="ImageUrl" class="form-control" />
                <span asp-validation-for="ImageUrl" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Status" class="control-label"></label>
                @(Html.Kendo().DropDownListFor(x => x.Status)
                      .DataTextField("Name")
                      .DataValueField("EnumIndex")
                      .DataSource(source =>
                      {
                          source.Read(read =>
                          {
                              read.Action("GetStatus", "Groups");
                          });
                      })
                      .HtmlAttributes(new { style = "width: 75%" })
                      )
            </div>
        </form>
    </div>
</div>


@section Scripts {
    @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
}



Controller Method:

/// <summary>
///
/// </summary>
/// <param name="request"></param>
/// <param name="grp">DO NOT RENAME THIS PARAM TO "group" as it will cause the control to not submit</param>
/// <returns></returns>
[AcceptVerbs("Post")]
public async Task<JsonResult> UpdateJson(
    [DataSourceRequest] DataSourceRequest request,
    Group grp)
{
    if (ModelState.IsValid)
    {
        customerDbContext.Update(grp);
        await customerDbContext.SaveChangesAsync();
    }

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

 

The drop down looks good with the list of Status values but my problem is, the Group's Status value does not change.  What did I miss?

Thanks, Joel

[Konstantin Dikov]

Hello Joel,

If the EnumIndex value is an integer type as the Status field, selecting from the DropDownList should update the integer value in the TreeList model correctly. One thing that I could suggest is to set the ValuePrimitive property of the DropDownList to "true" to see if that will make any difference. Another thing that you could test is to set the DataTextField to "EnumIndex" as well, just to see if the data is correct.

Hope this helps.


Regards,
Konstantin Dikov
Progress Telerik

[Joel]

I messed around with this until it worked... I'm actually not sure what changed that made the difference. So, likely have the same problem again very shortly.

Thanks for your help, Joel