Подтвердить что ты не робот

Добавить класс css в Html.EditorFor в MVC 2

Я пытаюсь добавить класс css в текстовое поле. Это то, что у меня есть на мой взгляд:

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

Я пробовал следовать инструкциям на этой ссылке, выполнив мой код:

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

Но я получаю ошибку компилятора:

Синтаксическая ошибка, ',' ожидается

Что я здесь делаю неправильно?

4b9b3361

ОТВЕТЫ

Ответ 1

Я бы предложил использовать Шаблоны редакторов. Это определенно "правильный" способ создания вашего редактора.

Вы можете указать свойство модели использовать шаблон редактора двумя способами.

Первым (самым простым) является создание шаблона редактора для определенного типа данных - например, DateTime.
Второй способ сделать это - сделать декларативно в ваших DataAnnotations с помощью UIHint.

Edit
Я также хотел бы добавить, что вы должны использовать тип даты в своем поле ввода, чтобы даже когда JavaScript отключен, ваш пользователь может по-прежнему видеть родной datepicker (только для современных браузеров HTML5)
<input id="meeting" type="date" value="2011-01-13"/>

Ответ 2

С MVC3 я продолжал стучать головой, потому что я не мог заставить это работать. Я не хотел создавать целый EditorTemplate для добавления одного класса.

Ну, вместо использования редактора, используйте TextBoxFor, конечно же, знак равенства:

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

Ответ 3

Я предполагаю, что быстрый и грязный способ сделать это будет в jQuery, да?

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

Ответ 4

В идеале вы должны использовать Шаблоны Редактора. Я обошел эту проблему, используя шаблон редактора внутри MvcHtmlString.Create(), который позволит вам перестроить фактический HTML-код. Конечно, вы захотите скопировать все в разделе "класс", чтобы сохранить шаблон редактора как можно более полезным.

Я попробовал много из приведенных выше предложений, но в конце концов, я решил это, потому что я считаю это менее сложным, и он позволяет мне продолжать использовать шаблоны редактора:

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

Ответ 6

Я знаю, что это старый вопрос, но я думал, что могу внести свой вклад. У меня была та же проблема и я хотел избежать создания шаблонов редакторов. Я просто хотел, чтобы общий дескриптор всех решений позволял мне указывать атрибуты html при использовании Html.EditorFor в представлении.

Мне очень понравился ответ 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.

Ответ 7

Я искал решение применить стиль к определенному блоку, сгенерированному методом @HTML.EditorFor helper.

Вопрос касался установки класса CSS для @HTML.EditorFor, но для тех, кто хочет отредактировать стиль для одного элемента.., вы можете, например, попробовать следующее:

В моем блоке я добавил стиль, основанный на идентификаторе, сгенерированном помощником: ..

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

Ответ 8

Здесь очень простое решение: удалите двойные кавычки из "datepicker" и верните их обратно в Visual Studio, и он должен работать.

У меня была та же проблема. Я скопировал/вставил образец кода из Интернета, и код имел специальный тип цитаты, который вызвал проблему синтаксиса ",". Я знаю, что это действительно не очевидно.