I am trying to get a Kendo DropDownList—declared inside of a Kendo Template script block—to automatically select an item from its list when a data value is provided to the template. I’m not having any luck doing this because I don’t understand how to plumb this particular case. My project has many other Kendo DropDownList controls, and they work just fine, but they are not declared inside of any Kendo Templates.
Basically, I have a parent Kendo Grid with the following declaration (irrelevant Razor omitted for clarity):
@(Html.Kendo().Grid<DocumentUploadViewModel>() .ClientDetailTemplateId("documentUploadTemplate")My intention is to provide an editor template for the grid consisting of a Kendo Template script block. At the moment, that template looks like this:
<script id="documentUploadTemplate" type="text/kendo-tmpl"> <div> <p>ID: ${Id}</p> <p>Document Type ID: ${DocumentTypeId}</p> <p>Document Type Name: ${DocumentTypeName}</p> <p>Path: ${Path}</p> <p>FileName: ${FileName}</p> <p>MIME Type: ${MimeType}</p> </div> <div> @(Html.Kendo().DropDownList() .Name("uxDocumentTypeName#=Id#") .OptionLabel("Please Select...") .DataValueField("DocumentTypeId") .DataTextField("DocumentTypeName") .DataSource(s => { s.Read(r => { r.Action("GetDocumentTypes", "MyController"); }) .ServerFiltering(true); }) .ToClientTemplate() ) </div></script>My parent grid, which is working fine, is bound to a populated DocumentUploadViewModel, and its field values are surfaced in the Kendo Template for debugging purposes. When I invoke my grid’s “edit” button, I see the selected grid item’s bound data appear correctly inside the DIV at the top of the presented template.
The drop-down itself is full of data from the DataSource.Read.Action call, and I can manually make selections. However, I am unsure how to wire the control so that it automatically selects the item specified by the passed-in “DocumentTypeId” field. I do see this field value rendering correctly in the DIV, and the visible ID matches one of the items found in the drop-down’s data.
Normally, I would write @Html.Kendo.DropDownListFor(m => m.DocumentTypeId) but I can’t get at the “model” passed into the Kendo template. I have tried .BindTo("#=DocumentUploadViewModel.DocumentTypeId") as well as other variations, to no avail.