在MVC 2中將css類添加到Html.EditorFor

Question

我正在嘗試將css類添加到文本框中。 這就是我的看法：

<%: Html.EditorFor(m => m.StartDate) %>

我嘗試按照此鏈接中的說明操作我的代碼：

<%: Html.EditorFor(m => m.StartDate, new { @class: "datepicker" }) %>

但我得到一個編譯器錯誤說：

語法錯誤，'，'預期

我在這做錯了什么？

Answer 1

有了MVC3，我一直在搖頭，因為我無法讓它發揮作用。 我不想創建一個完整的EditorTemplate來添加一個類。

好了，而不是使用EditorFor，使用TextBoxFor，當然是有等號，如下所示：

@Html.TextBoxFor(m=> m.ZipCode, new { @class = "zip" })

Answer 2

我強烈建議使用編輯器模板 。 這絕對是為您的EditorFor設計樣式的“正確”方式。

您可以通過兩種不同的方式告訴模型屬性使用編輯器模板。

第一個（最簡單的）是為某種數據類型創建一個編輯器模板 - 例如DateTime 。
第二種方法是使用UIHint在DataAnnotations中以聲明方式設置它。

編輯
我還想補充一點，您應該在輸入字段中使用“日期”類型，以便即使禁用JavaScript，您的用戶仍然可以看到本機日期選擇器（僅在現代HTML5瀏覽器上有效）
<input id="meeting" type="date" value="2011-01-13"/>

Answer 3

我想快速而骯臟的方法是在jQuery中，是嗎？

$(document).ready(function () {
    $('#StartDate').addClass('datepicker');
});

Answer 4

理想情況下，您應該使用編輯器模板。 我通過在MvcHtmlString.Create（）中使用編輯器模板解決了這個問題，它可以讓你重建實際的HTML代碼。 當然，您需要復制“類”部分中的所有內容，以使編輯器模板盡可能有用。

我嘗試了上面的許多建議，但最終，我確定了這一點，因為我認為它不那么復雜，它讓我繼續使用編輯器模板：

@MvcHtmlString.Create(Html.EditorFor(m => m.StartDate).ToString().Replace("class=\"text-box single-line\"", "class=\"text-box single-line datepicker\""))

Answer 5

我知道這是一個古老的問題，但我認為我可以做出貢獻。 我有同樣的問題，並希望避免制作編輯器模板。 我只想要一個通用的句柄，它允許我在視圖中使用Html.EditorFor時指定html屬性。

我真的很喜歡CIA的答案，但我對它進行了一些擴展，以便你可以傳遞你需要的任何屬性。 我創建了一個額外的Html.EditorFor方法，它接受html屬性： -

public static class EditorForExtentions
{
    public static MvcHtmlString EditorFor<TModel, TValue>(this HtmlHelper<TModel> html, Expression<Func<TModel, TValue>> expression, Object htmlAttributes, bool extendAttributes)
    {
        string value = html.EditorFor(expression).ToString();

        PropertyInfo[] properties = htmlAttributes.GetType().GetProperties();
        foreach (PropertyInfo info in properties)
        {
            int index = value.ToLower().IndexOf(info.Name.ToLower() + "=");
            if (index < 0)
                value = value.Insert(value.Length - (value.EndsWith("/>") ? 2 : 1), info.Name.ToLower() + "=\"" + info.GetValue(htmlAttributes, null) + "\"");
            else if (extendAttributes)
                value = value.Insert(index + info.Name.Length + 2, info.GetValue(htmlAttributes, null) + " ");            
        }

        return MvcHtmlString.Create(value);
    }
}

你可以在這樣的視圖中調用它

<%=Html.EditorFor(m => m.StartDate, new { @class = "datepicker" }, true)%>

它使用普通的Html.EditorFor方法獲取html字符串，然后注入所需的html屬性。

Answer 6

EditorFor沒有重載，允許您設置HtmlProperties。 （IDictionary htmlAttributes）

此鏈接說明了如何執行此操作：

http://aspadvice.com/blogs/kiran/archive/2009/11/29/Adding-html-attributes-support-for-Templates- 2D00 -ASP.Net-MVC-2.0-Beta_2D00_1.aspx

Answer 7

我正在尋找一種解決方案，將樣式應用於@ HTML.EditorFor輔助方法生成的特定框。

問題是關於為@ HTML.EditorFor設置CSS類，但對於想要編輯單個元素的樣式的人來說，你可以嘗試這樣做：

在我的塊中，我添加了一個基於幫助程序生成的ID的樣式：

<style> 
    #EnrollmentInfo_Format
    {
        width:50px;
        font: normal 100% 'Lucida Grande',Tahoma,sans-serif;
        font-size: 11px;
        color: #2e6e9e;
    }
</style>

然后在我的頁面中（我在局部視圖中這樣做）：

@Html.EditorFor(e => e.EnrollmentInfo.Format)

Answer 8

這是一個非常簡單的解決方案：從"datepicker"刪除雙引號並將它們重新鍵入Visual Studio，它應該可以工作。

我有同樣的問題。 我從網上復制/粘貼了示例代碼，代碼有一種特殊類型的引用，導致了","語法問題。 我知道這真的不明顯。