如何強制MVC4/Razor在SelectListItem中呈現標記？

我可以有選擇標籤內的標籤，和它的作品（不知道這是否是有效的HTML4/5，但在Firefox至少工作）：如何強制MVC4/Razor在SelectListItem中呈現標記？

<select> 
    <option><i class="icon-plus"></i>Add item</option> 
    <option><i class="icon-remove"></i>Remove item</option> 
    <option><i class="icon-edit"></i>Edit item</option> 
</select>

我將引導/ FontAwesome web字體圖標在這些選項標籤中。

但我使用的是MVC4/Razor，並且我無法獲得正確的語法以使其正確呈現。它編碼所有這些內部標籤，我得到<，>等

這是我在做什麼：

// first I make a new list with the icons inside 
var items = Model.Items.Select(q => new SelectListItem() { 
    Selected = q.Selected, 
    Text = "<i class=\"icon-add\"></i>" + q.Text, 
    Value = q.Value 
    }); 
// then render the dropdown 
Html.DropDownListFor(m => m.SelectedItem, items, "All")

我如何得到這個工作？

來源

2013-02-17 Bobby B

你檢查過以確保Model.Items有數據嗎？並在你的文章中包含你的錯誤消息。 – 2013-02-17 21:24:23

看起來像[選項只允許文本]（http://www.w3.org/TR/html-markup/option.html），所以我想要的工作，但無效。 – 2013-02-17 21:42:32

好，我選擇一個簡單易選項 ...

只要把FontAwesome類的<option>標籤，而不是一個嵌套的子<i>標籤。這樣標記是有效的。

當然這需要在循環中手動完成。

來源

2013-02-17 21:46:37

開箱即可使用此功能。取決於你需要多久使用它 - 我個人建議通過循環手動進行。

如果需要，可以爲下拉列表編寫一個擴展方法/助手。

我發現了一個類似的例子在這裏，雖然這傢伙用它來定製「選擇」的標籤，你要自定義「選項」標籤：Fun (?) with Linq Expressions in extension methods

希望這有助於。

來源

2013-02-17 21:24:42

是的，我也這麼想。我認爲'@ Html'擴展方法自己做了編碼，所以沒有辦法讓它們發出原始標記。我想一個自定義擴展方法是我選擇的唯一*選項... * – 2013-02-17 21:36:55

如何強制MVC4/Razor在SelectListItem中呈現標記？

回答

相關問題