MVC3 SelectListItem. Is it possible to decorate it with custom html attributes?

if I have something like this:

@{
   var cats = GetCategories();
   var selectList = from c in cats
   select new SelectListItem
   {
     Selected = (c.Id == Model.SessionCategory.Id),
     Text = c.Name,
     Value = c.Id.ToString(),
    };
  }
 @Html.DropDownList("categories", selectList)

The markup would be like this:

 <select id="categories" name="categories">
    <option value="1">Category1</option>
    <option value="2">Category2</option>
    <option selected="selected" value="3">Category3</option>
 </select>

And no开发者_如何转开发w, the question is:

Is it possible to add additional attributes to each <option> tag? I mean from the Razor template. Without jQuery workarounds?

I think the most practical solution would be some jQuery or maybe something like this..

<select id="categories" name="categories">
    @foreach (var item in selectList) {
        <option @if (item.Selected) { <text>selected="selected"</text>} value="@item.Value">@item.Text</option>
    }
</select>

you could obviously add in attributes as needed...

By default, no. The SelectListItem does not contain any additional properties to add your attributes to. However, you could create your own DropDownList method or DropDownListFor and create your own ListItemToOption with a custom SelectListItem to add your own attributes.

But it's probably overkill.

Here's how I did it:

I created my own DropDownListFor:

    public static MvcHtmlString TheDropDownListFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression, IEnumerable<SelectListItem> listOfValues, string placeHolder)
    {
        var model = htmlHelper.ViewData.Model;
        var metaData = ModelMetadata .FromLambdaExpression(expression, htmlHelper.ViewData);

        var tb = new TagBuilder("select");

        if (listOfValues != null)
        {
            tb.MergeAttribute("id", metaData.PropertyName);
            tb.MergeAttribute("name", metaData.PropertyName);

            if (!string.IsNullOrEmpty(placeHolder))
            {
                var option = new TagBuilder("option");
                option.MergeAttribute("value", placeHolder);

                tb.InnerHtml += option.ToString();
            }

            foreach (var item in listOfValues)
            {
                var option = new TagBuilder("option");
                option.MergeAttribute("value", item.Value);

                var textNdata = item.Text.Split('|');

                option.InnerHtml = textNdata[0];

                if (textNdata.Length == 2)
                    option.MergeAttribute("data-name", textNdata[1]);

                if(item.Selected)
                    option.MergeAttribute("selected", "selected");

                tb.InnerHtml += option.ToString();
            }
        }

        return MvcHtmlString.Create(tb.ToString());
    }

Then my SelectListItem List is created like this:

    public List<SelectListItem> EmployerList
    {
        get
        {
            return Employers.Select(x => new SelectListItem
            {
                Text = x.EAN + "|" + x.Name,
                Value = x.Id.ToString(),
                Selected = (SelectedEmployer != null && SelectedEmployer.Id == x.Id)
            }).ToList();
        }
    }