使用Enum Kendo UI的DropDownList

时间:2013-04-05 17:19:09

标签: asp.net-mvc kendo-ui html.dropdownlistfor

我正在努力更新应用程序以使用Kendo UI,并且遇到了使用DropDownList绑定到Enum的问题。我遇到的两个问题是:1)该值不包含Enum值,而是包含“Today”(应为0),以及2)显示值始终为“Last10Days”而不是“Last 10 Days”标签。我看了,找不到另一个地方,有人使用Kendo UI将描述显示为文本,并包含数值而不是文本。任何帮助表示赞赏。

视图

<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>

模型

    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
}

}

8 个答案:

答案 0 :(得分:5)

AFAIK,这不会自动支持。

你可以编写一个小辅助方法,它采用一个Enum类型并将其转换为List<SelectListItem>,如下所示:

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()
}

然后您可以将DropDownList绑定到选择列表:

.BindTo( EnumToSelectList( typeof( SearchDateRanges ) ) )

如果您希望文本来自Description属性,则必须修改此属性以获取属性值 - 可能是通过Reflection。

答案 1 :(得分:5)

您似乎要求枚举的变量名称而不是描述属性:

.BindTo(Enum.GetNames(typeof(SearchDateRanges)).ToList())

要获取描述属性,您必须做一些工作。以下是我发现的一些代码:

public static string GetEnumDescription(Enum value)
{
    FieldInfo fi = value.GetType().GetField(value.ToString());

DescriptionAttribute[] attributes =
    (DescriptionAttribute[])fi.GetCustomAttributes(
    typeof(DescriptionAttribute),
    false);

if (attributes != null &&
    attributes.Length > 0)
    return attributes[0].Description;
else
    return value.ToString();
}

您还将文本字段绑定到枚举中不存在的“文本”。

希望这有帮助。

答案 2 :(得分:3)

带有@Html.EnumDropDownListFor的.NET MVC 5.1。

只需在.cshtml文件夹中创建一个新的Views/EditorTemplate

例如,在带网格的cshtml中,

@(Html.Kendo().Grid<NameProved.Models.Issuer>()
.Name("IssuerGrid")
.Columns(columns =>
{
    columns.Bound(issuer => issuer.ID);
    columns.Bound(issuer => issuer.Name);
    columns.Bound(issuer => issuer.IssuerType);

    columns.Command(commands =>
        {
            commands.Edit();
            commands.Destroy();
        }).Title("Commands");
})
.ToolBar(toolbar => toolbar.Create())
.Editable(editable => editable
    .Mode(GridEditMode.PopUp)
    )
.DataSource(datasource =>
    datasource
    .Ajax()
    .Events(events => events.Error("grid_error"))
    .Model(model =>
    {
        model.Id(issuer => issuer.ID);
        model.Field(issuer => issuer.ID).Editable(false).DefaultValue(0);
    })
    .Create(create => create.Action("Issuer_Create", "Admin"))
    .Read(read => read.Action("Issuer_Read", "Admin"))
    .Update(update => update.Action("Issuer_Update", "Admin"))
    .Destroy(destroy => destroy.Action("Issuer_Destory", "Admin"))
    )
.Pageable()

)
)

在此您必须将UIHint添加到issuerType,即enum

然后在Views/Shared/EditorTemplate/IssuerTypeEditor.cshtml

@model NameProved.Models.IssuerType

@Html.EnumDropDownListFor(issuerType => issuerType)

然后在模型中添加UIHint

public class Issuer
{

    public int ID { get; set; }
    public string Name { get; set; }

    [UIHint("IssuerTypeEditor")]
    public IssuerType IssuerType { get; set; }
}

然后你会得到它。

答案 3 :(得分:2)

我知道这个帖子已经老了但是如果有人为同样的问题搜索,这是另一个解决方案:

@(Html.Kendo().DropDownList()
    .Name("subscriptionTypeTest")
    .DataTextField("Text")
    .DataValueField("Value")
    .BindTo(Html.GetEnumSelectList(typeof(SubscriptionType)))
    .Deferred()
)

答案 4 :(得分:1)

你可以尝试这个

@(Html.Kendo().DropDownListFor(model => model.NoticePeriodType)
      .DataTextField("Text")
      .DataValueField("Value")
      .DataSource(source =>
         {
           source.Read(read =>
           {
              read.Action("LoadPeriodTypesAjax", "ControllerName"); //put controller name
            });
         })
   )


public JsonResult LoadPeriodTypesAjax()
{
    var values = Enum.GetValues(typeof(PeriodType)).Cast<int>(); //PeriodType= enum name
    var converter = TypeDescriptor.GetConverter(typeof(PeriodType));
    var datas = from value in values
                select new SelectListItem
                {
                    Text = converter.ConvertToString(value),
                    Value = value.ToValue(),
                };
    return Json(datas, JsonRequestBehavior.AllowGet);
}

答案 5 :(得分:1)

Andre的答案仅适用于ASP.Net MVC 5.1及以上版本。 对于旧版本,您可以使用EnumHelper.GetSelectList

@(Html.Kendo().DropDownList()
    .Name("subscriptionTypeTest")
    .DataTextField("Text")
    .DataValueField("Value")
    .BindTo(EnumHelper.GetSelectList(typeof(SubscriptionType)))
    .Deferred()
)

答案 6 :(得分:1)

这与 Nikolay Kostov 的回答非常相似。这适用于 Telerik asp.net 核心。这是您的编辑器模板的代码。

@model Enum

@(Html.Kendo().DropDownListFor(m => m)
        .DataTextField("Text")
        .DataValueField("Value")
        .BindTo(Html.GetEnumSelectList<Web.Models.YourEnumType>())
        
    )

答案 7 :(得分:0)

如果在Kendo UI和ASP.NET Core中需要枚举的编辑器模板,则可以在Enum.cshtml中使用此编辑器模板代码:

@model Enum
@{
    var values = Enum.GetValues(this.ViewData.ModelMetadata.ModelType).Cast<object>()
        .Select(v => new SelectListItem
                     {
                         Selected = v.Equals(this.Model),
                         Text = v.ToString(),
                         Value = ((int)v).ToString()
                     });                               
}

@(this.Html.Kendo().DropDownListFor(m => m)
    .DataTextField("Text")
    .DataValueField("Value")
    .BindTo(values))