Kendo DropDown returning Value instead of Text - asp.net-mvc

Question

I use the dropdown list as an EditorTemplate for a column in the grid:
#model Guid?
#(Html.Kendo().DropDownListFor(m => m)
.DataValueField("Id")
.DataTextField("Name")
.DataSource(dataSource =>
{
dataSource.Read(read => read.Action(MVC.Controller.ActionNames.ActionName_Read, MVC.Controller.Name))
.ServerFiltering(true);
})
.ValuePrimitive(true)
)
My Controller:
public virtual ActionResult ActionName_Read()
{
var applicationID = AppSettings.Id.Guid;
var return = _db.table.Where(w => w.ID == appID).Select(s => new { s.Name, Id = s.Guid});
return Json(return, JsonRequestBehavior.AllowGet);
}
My Column:
columns.Bound(c => c.Name).Filterable(f => f.UI("$.proxy(filterFunction, {field: Name})").Operators(o => o.ForString(e => e.Clear().IsEqualTo("Is equal to").IsNotEqualTo("Is not equal to")))).EditorTemplateName("EditorTemplateName");
I added .ValuePrimitive(true) and that returns the ID, but if I remove that, it returns [object object].
I have the Name and the ID return from the action, but only the name field gets populated, and it gets populated by the ID.

Answer 1

You can use the .ValueTemplate() property.
here is one example https://demos.telerik.com/aspnet-mvc/dropdownlist/template
.ValueTemplate("#:yourObject.Name#")

Answer 2

I looped into the change event of my DropDownList in the EditorTemplate and did the following:
function selectRow(name, event) {
var rowUid = $("#Name").closest("tr").attr("data-uid");
var rowItem = $("#" + name).data("kendoGrid").dataSource.getByUid(rowUid);
var currentName = event.sender._focused[0].textContent;
var currentDataSource = event.sender.dataSource._data;
for (var i = 0; i < currentDataSource.length; i++) {
if (currentDataSource[i].Name=== currentName) {
rowItem.set("Id", currentDataSource[i].Id);
rowItem.set("Name", currentDataSource[i].Name);
}
}
}