DropDownList with Enum Kendo UI

sevargdcg picture sevargdcg · Apr 5, 2013 · Viewed 13.6k times · Source

I'm working on updating an application to use Kendo UI and have run into an issue with binding to an Enum with the DropDownList. The two issues I am having is 1) the value does not contain the Enum value and instead contains "Today" (should be 0), and 2) The display value is always "Last10Days" instead of "Last 10 Days" in the description tag. I looked and couldn't find another place where someone has used Kendo UI to display the description as the text and include the numerical value instead of the text. Any help is appreciated.

View

<div class="span6">
  @Html.LabelFor(m=> m.DateRanges)
  @(Html.Kendo().DropDownListFor(m => m.DateRanges)
      .BindTo(Enum.GetNames(typeof(SearchDateRanges)).ToList())
      .HtmlAttributes(new { value = "Today" })
      .DataTextField("Text")
      .Events(e => e.Change("DateChange")))
</div>

<div class="span6">
  @Html.LabelFor(m => m.Status)
  @(Html.Kendo().DropDownListFor(m=> m.Status)
      .BindTo(Enum.GetNames(typeof(SearchStatusCriteria)).ToList())
      .HtmlAttributes(new {value = "All"}))
</div>

Model

    public enum SearchDateRanges
{
    [Description("Today")]
    Today = 0,

    [Description("Last 10 Days")]
    Last10Days = 1,

    /// <summary>
    /// The last 30 days.
    /// </summary>
    [Description("Last 30 Days")]
    Last30Days = 2,

    [Description("Last 60 Days")]
    Last60Days = 3,

    [Description("Last 90 Days")]
    Last90Days = 4,

    [Description("Custom Date Range")]
    CustomRange = 5
}

}

Answer

Nick Butler picture Nick Butler · Apr 5, 2013

AFAIK, this isn't supported automatically.

You can write a little helper method that takes an Enum type and converts it to a List<SelectListItem> like this:

public static List<SelectListItem> EnumToSelectList( Type enumType )
{
  return Enum
    .GetValues( enumType )
    .Cast<int>()
    .Select( i => new SelectListItem
      {
        Value = i.ToString(),
        Text = Enum.GetName( enumType, i ),
      }
    )
    .ToList()
}

Then you can bind your DropDownList to the Select List:

.BindTo( EnumToSelectList( typeof( SearchDateRanges ) ) )

If you want the text to come from the Description attributes, you'll have to modify this to get the attribute values - probably via Reflection.