Kendo Grid DropDownList not work

Question

Cannot bind DropDownList in kendo grid. it works fine if it's not inside the grid. I try to use

@(Html.Kendo().DropDownList()
                                      .Name("RegionId")

                                      .OptionLabel("[|[Select...]|]")
                                      .DataTextField("Name")
                                      .DataValueField("Id")
                                      .DataSource(source =>
                                      {
                                          source.Read(read =>
                                          {
                                              read.Action("FindAll", "region")
                                                  .Data("filterRegion");
                                          })
                                           .ServerFiltering(true);

                                      })
                                      .HtmlAttributes(new { @required = "" })
                                      .Enable(false)
                                      .AutoBind(false)
                                      .CascadeFrom("CountryId")
                                       .ValuePrimitive(true).HtmlAttributes(new { @required = "" })
    )

and its bind as a text box, not drop-down list. how to make it bind drop-down list? note: the values do not have a relation in a database I need to just columns and make it by code.

Are you want to bind dropdownlist as part of Grid's edit template or something like that? Also provide current grid definition while necessary. — Tetsuya Yamamoto
Yes i need as a part of columns in grid @(Html.Kendo().Grid<UserViewModel>() .Name("Users") .Columns(columns => { // add DDl here } — Sameh

Anastasios Selmani Anastasios Selmani · Accepted Answer · 2018-07-23T15:30:01

It is not as simple as you may think I am afraid. The entire implementation can be found in the documentation of Telerik.

In a few words you have to:

Create an object (Text-Value or Id-Label) to bind to your column

Create an editor template for this class

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

Decorate your property with [UIHint("ObjectEditor")]

Kendo Grid DropDownList not work

1 Answers