Update Kendo grid with editor dropdownlist value

Question

I have a Kendo grid set up like so:

@(Html.Kendo().Grid<ParticipatingDentalEE>()
.Name("DentalEE")
.Columns(columns =>
{
    columns.Bound(p => p.State).Title("State").Width(150).EditorTemplateName("State");
    columns.Bound(p => p.Count).Title("Count").Width(150);
    columns.Command(c => { c.Edit(); c.Destroy(); });
})
.DataSource(dataSource => dataSource
    .Ajax()           
    .Model(m => {
        m.Id(p => p.State);
        m.Field(p => p.State).Editable(true);
        m.Field(p => p.Count).Editable(true).DefaultValue("");
    })
    .Create(update => update.Action("EditingInline_Create", "Dental"))
    .Read(read => read.Action("EditingInline_Read", "Dental"))
    .Update(update => update.Action("EditingInline_Update", "Dental"))
    .Destroy(update => update.Action("EditingInline_Destroy", "Dental"))
)
//.Scrollable()
//.Sortable()
.Editable(e => e.Mode(GridEditMode.InLine))

)

The "State" column consists of a dropdown template that looks like this:

@(Html.Kendo().DropDownList()
    .Name("States") // Name of the widget should be the same as the name of the property
    .DataValueField("CODE") // The value of the dropdown is taken from the EmployeeID property
    .DataTextField("NAME") // The text of the items is taken from the EmployeeName property
    .BindTo((System.Collections.IEnumerable)ViewData["States"]) // A list of all employees which is populated in the controller
)

My dropdown shows up properly when I edit or create an item, but when I save the item the dropdown value does not stay in the grid. Is there something else I need to set up in order to do this?

Answer 1

as you say in your own comment,

.Name("States") // Name of the widget should be the same as the name of the property

which is to say, it must match the name of the column, and the column name is "State" not "States".

Answer 2

Obviously this is an old thread, however the fix is to use the DropDownListFor method (as opposed to the DropDownList) and not to specify a name. I suspect Kendo does some internal name matching to apply the edited value back to the model.

@model int // ...or whatever type works for your model

@(Html.Kendo().DropDownListFor(i => i)
    .DataValueField("CODE")
    .DataTextField("NAME")
    .BindTo((System.Collections.IEnumerable)ViewData["States"]))

Answer 3

I'm not sure if this will fix your problem, but the editor templates for my grid didn't work correctly until I had set the UIHint decorator in the model, and the EditorTemplateName in the view.

E.g.

public class ParticipatingDentalEE {
   ...

   [UIHint("State")] // this should be the name of your EditorTemplate
   public State State { get; set; }

}

I speculate that UIHint is used for the grid in 'view' mode, while the EditorTemplateName is used while in 'edit' mode, and both are required to link the two together.