kendo mvc editor not binding to selected dropdown property - asp.net-mvc

Question

Using inline editing from a kendo grid (v 2017.3.913), the editor template used for the dropdown is not using the property id to set the selected value in the list (or it's another issue but related).
I tried several solutions from like-kind SO questions but nothings has yielded the expected results.
kendo grid
//ParentOrganization is the target property
#(Html.Kendo().Grid<OrganizationGridViewModel>()
.Name("organizationGrid")
.Columns(columns =>
{
columns.Bound(o => o.Id).Width(150).Hidden(true);
columns.Bound(o => o.Name);
columns.Bound(o => o.ParentOrganization).ClientTemplate("#= (ParentOrganization.Id == 0) ? ' ' : ParentOrganization.Name #").EditorTemplateName("ParentOrganization");
columns.Bound(o => o.OrganizationTypeDescription).Width(165);
columns.Command(command =>
{
command.Edit().Text(" ").HtmlAttributes(new { title = "Edit Organization" });
command.Destroy().Text(" ").HtmlAttributes(new { title = "Delete Organization" });
}).Width(250);
})
.ToolBar(toolbar => toolbar.Create().Text("New"))
.Editable(editable => editable.Mode(GridEditMode.InLine).ConfirmDelete("Are you sure you want to delete this organization?")
.DisplayDeleteConfirmation("Organization deleted"))
...
Since the bound column is an navigational object (versus a primitive type) I use the [UIHint] in the viewmodel to point to an editor template, so that the object is mapped properly.
viewmodel used in the grid
public class OrganizationGridViewModel
{
...
// NOTE: the Organization object has "Id" and "Name" properties
[UIHint("ParentOrganization")]
public Organization ParentOrganization { get; set; }
}
editor template
#(Html.Kendo().DropDownList()
.Name("ParentOrganization")
.DataTextField("Text")
.DataValueField("Value")
.BindTo((IEnumerable) ViewData["OrganizationSelectList"])
)
And finally, the data used by the dropdownlist:
var orgSelectList = organizations.Select(n => new SelectListItem
{
Text = n.Name,
Value = n.Id.ToString()
}).ToList();
ViewData["OrganizationSelectList"] = new SelectList(orgSelectList, "Value", "Text");
NOTE
I also tried creating a SelectList using "Id" & "Name" (propagated the change to the editor as well - replaced "Value" & "Text") so it would align with the ParentOrganization object but that ended up producing "undefined" list items.
orgSelectItems.AddRange(organizations.Select( n => new BaseSelectItem
{
Id = n.Id,
Name = n.Name
}));
ViewData["OrganizationSelectList"] = new SelectList(orgSelectList, "Id", "Name");

Answer 1

This is how im getting data into and out of my dropdowns for Kendo
#(Html.Kendo().DropDownList()
.Name("showProcessed")
.DataTextField("OptionText")
.DataValueField("ViewOption")
.AutoBind(true)
.SelectedIndex(2)
.Events(e => e.Change("fe_DiaryItem.processedChange"))
.HtmlAttributes(new { style = "width: 250px;" })
.DataSource(ds =>
{
ds.Read("DiaryGridViewOptions", "ControllerName");
})
)
In this instance I populate the object with the DataSource, and select the index using .SelectedIndex(x).
I have other examples of how to set the index if you need but this is working production code.
----Edit----
#{
var idxDst = 0;
if (Model.DiaryTimeSlot != null && Model.DiaryTimeSlotSelectedId > 0)
{
idxDst = Model.DiaryTimeSlot.IndexOf(Model.DiaryTimeSlot.First(x => x.DiaryTimeSlotID == Model.DiaryTimeSlotSelectedId));
}
}
#(Html.Kendo().DropDownList()
.Name("DiaryTimeSlot")
.DataTextField("Description")
.DataValueField("DiaryTimeSlotID")
.SelectedIndex(idxDst)
.BindTo(Model.DiaryTimeSlot)
.DataSource(ds =>
{
ds.Read("DiaryTimeSlotOptions", "ControllerName");
})
)

Answer 2

It appears that [Kendo or MVC helpers themselves] don't like you using "proper" [Domain] objects - appears to confuse the binding. I believe the root cause is the property names are the same (Id & Name) and need to be different. I was using a domain object Organization as the property's type. I created another viewmodel to represent the organization and used different property names:
new viewmodel to represent the org
instead of using "Id" & "Name" as the mapped text and value properties I'm using the following "ParentOrganization-x" properties:
public class ParentOrganizationViewModel
{
public int? ParentOrganizationId { get; set; }
public string ParentOrganizationName { get; set; }
}
So an update to the grid viewmodel will reflect the new org viewmodel:
public class OrganizationGridViewModel
{
...
[UIHint("ParentOrganization")]
public ParentOrganizationViewModel ParentOrganization { get; set; }
}
Also, instead of returning a SelectList as the datasource to the dropdown, it's a straight viewlmodel list:
var orgSelectList = organizations.Select(n => new ParentOrganizationViewModel()
{
ParentOrganizationName = n.Name,
ParentOrganizationId = n.Id
}).ToList();
ViewData["OrganizationSelectList"] = orgSelectList;
The final changes are in the editor template, to change the DataTextField and DataValueField properties match the org viewmodel:
#(Html.Kendo().DropDownList()
.Name("ParentOrganization")
.DataTextField("ParentOrganizationName")
.DataValueField("ParentOrganizationId")
.AutoBind(true)
.ValuePrimitive(true)
.BindTo((IEnumerable) ViewData["OrganizationSelectList"])
)