Kendo Grid Using Dropdown in a inline edit mode

If using a grid with inline edit mode (or even the incell batch mode) with some fields being selections from lists then kendo dropdowns can be used within the grid.
First make sure the dropdown contents are available. Easiest way is to include them in the views model.
View has:

@model DrawingConfigViewModel

Viewmodel classes

public class idtextPairViewModel{  
    public int Id { get; set; }
    public string ItemText { get; set; }

public class DrawingConfigViewModel {  
    public int ProjectId { get; set; }
    public List<idtextPairViewModel> FacilityList { get; set; }

In the grid on the view page add the column as a foreign key

columns.ForeignKey(p => p.FacilityId, @Model.FacilityList, "Id", "ItemText").Width(150).Locked(true);  

Where FacilityId is the field in the grids data source.
The display and value fields of the dropdown data source have to be given.

For this to work a edit template needs to be created.
In the VIEWS\SHARED create a new directory EditorTemplates
Add the new class called GridForeignKey.cshtml
With the contents:

@model object
 Html.Kendo().DropDownListFor(m => m).OptionLabel("Select...")        
        .BindTo((SelectList)ViewData[ViewData.TemplateInfo.GetFullHtmlFieldName("") + "_Data"])

This creates a dropdown with the 'select' defaulted for new items.

For binding nulls use the data_value_primitive attribute

Html.Kendo().DropDownListFor(m => m).HtmlAttributes(new { data_value_primitive = "true" })

Above referring to version
Telerik Kendo UI Professional Q1 2015
Telerik UI for ASP.NET MVC Q1 2015

comments powered by Disqus