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();
}
}
精彩评论