EditorFor() и свойства html

Question

Asp.Net Предварительные сборки MVC 2.0 предоставляют такие помощники, как

Html.EditorFor(c => c.propertyname)

Если имя свойства является string , приведенный выше код отображает texbox.

Что делать, если я хочу передать свойства MaxLength и Size в текстовое поле или в мое собственное свойство класса css?

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

Answer 1

Я написал запись в блоге, чтобы ответить на свой вопрос

Добавление поддержки атрибутов HTML для шаблонов - ASP.Net MVC 2.0 Beta

Answer 2

В MVC3 вы можете установить ширину следующим образом:

@Html.TextBoxFor(c => c.PropertyName, new { style = "width: 500px;" })

Answer 3

Я решил эту проблему, создав шаблон EditorTemplate с именем String.ascx в моей папке / Views / Shared / EditorTemplates:

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<string>" %>
<% int size = 10;
   int maxLength = 100;
   if (ViewData["size"] != null)
   {
       size = (int)ViewData["size"];
   }
   if (ViewData["maxLength"] != null)
   {
       maxLength = (int)ViewData["maxLength"];
   }
%>
<%= Html.TextBox("", Model, new { Size=size, MaxLength=maxLength }) %>

На мой взгляд, я использую

<%= Html.EditorFor(model => model.SomeStringToBeEdited, new { size = 15, maxLength = 10 }) %>

Работает как очарование для меня!

Answer 4

Ни один из ответов в этой или любой другой теме по настройке атрибутов HTML для @ Html.EditorFor мне не сильно помог. Тем не менее, я нашел отличный ответ на

Разработка стиля помощника @ Html.EditorFor

Я использовал тот же подход, и он прекрасно работал без написания большого количества дополнительного кода. Обратите внимание, что атрибут id выходного файла html объекта Html.EditorFor установлен. Код вида

<style type="text/css">
#dob
{
   width:6em;
}
</style>

@using (Html.BeginForm())
{
   Enter date: 
   @Html.EditorFor(m => m.DateOfBirth, null, "dob", null)
}

Свойство модели с аннотацией данных и форматированием даты как " dd MMM гггг "

[Required(ErrorMessage= "Date of birth is required")]
[DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:dd MMM yyyy}")]
public DateTime DateOfBirth { get; set; }

Работал как шарм без написания большого количества дополнительного кода. В этом ответе используется ASP.NET MVC 3 Razor C #.

Answer 5

Возможно, вы захотите взглянуть на Запись в блоге Кирана Чанда , он использует собственные метаданные для модели представления, такие как:

[HtmlProperties(Size = 5, MaxLength = 10)]
public string Title { get; set; }

Это в сочетании с пользовательскими шаблонами, которые используют метаданные. Чистый и простой подход, на мой взгляд, но я хотел бы видеть этот общий вариант использования встроенным в mvc.

Answer 6

Я удивлен, что никто не упомянул о передаче его в " AdditionalViewData " и читать его на другой стороне.

Вид (для ясности с разрывами строк):

<%= Html.EditorFor(c => c.propertyname, new
    {
        htmlAttributes = new
        {
            @class = "myClass"
        }
    }
)%>

Шаблон редактора .

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<string>" %>

<%= Html.TextBox("", Model, ViewData["htmlAttributes"])) %>

Answer 7

Проблема в том, что ваш шаблон может содержать несколько HTML-элементов, поэтому MVC не будет знать, к какому из них применить ваш размер / класс.Вам придется определить это самостоятельно.

Сделайте свой шаблон производным от вашего собственного класса под названием TextBoxViewModel:

public class TextBoxViewModel
{
  public string Value { get; set; }
  IDictionary<string, object> moreAttributes;
  public TextBoxViewModel(string value, IDictionary<string, object> moreAttributes)
  {
    // set class properties here
  }
  public string GetAttributesString()
  {
     return string.Join(" ", moreAttributes.Select(x => x.Key + "='" + x.Value + "'").ToArray()); // don't forget to encode
  }

}

В шаблоне вы можете сделать это:

<input value="<%= Model.Value %>" <%= Model.GetAttributesString() %> />

На ваш взгляд, вы делаете:

<%= Html.EditorFor(x => x.StringValue) %>
or
<%= Html.EditorFor(x => new TextBoxViewModel(x.StringValue, new IDictionary<string, object> { {'class', 'myclass'}, {'size', 15}}) %>

Первая форма отобразит шаблон по умолчанию для строки.Вторая форма отобразит пользовательский шаблон.

Альтернативный синтаксис используйте свободный интерфейс:

public class TextBoxViewModel
{
  public string Value { get; set; }
  IDictionary<string, object> moreAttributes;
  public TextBoxViewModel(string value, IDictionary<string, object> moreAttributes)
  {
    // set class properties here
    moreAttributes = new Dictionary<string, object>();
  }

  public TextBoxViewModel Attr(string name, object value)
  {
     moreAttributes[name] = value;
     return this;
  }

}

   // and in the view
   <%= Html.EditorFor(x => new TextBoxViewModel(x.StringValue).Attr("class", "myclass").Attr("size", 15) %>

Обратите внимание, что вместо того, чтобы делать это в представлении, вы также можете сделать это в controller или, что гораздо лучше, в ViewModel:

public ActionResult Action()
{
  // now you can Html.EditorFor(x => x.StringValue) and it will pick attributes
  return View(new { StringValue = new TextBoxViewModel(x.StringValue).Attr("class", "myclass").Attr("size", 15) });
}

Также обратите внимание, что вы можете создать базовый класс TemplateViewModel - общую основу для всех ваших шаблонов просмотра, - который будет содержать базовую поддержку атрибутов / etc.

Но в целом я думаю, что MVC v2 нуждается в лучшем решении.Это все еще бета-версия - идите и спросите об этом ;-)

Answer 8

Я думаю, что использование CSS - это правильный путь.Я хотел бы сделать больше с .СЕТЕВОЕ кодирование, как в XAML, но в браузере CSS является королем.

Сайт.css

#account-note-input { 
  width:1000px; 
  height:100px; 
} 

.cshtml

<div class="editor-label"> 
  @Html.LabelFor(model => model.Note) 
</div> 
<div class="editor-field"> 
  @Html.EditorFor(model => model.Note, null, "account-note-input", null) 
  @Html.ValidationMessageFor(model => model.Note) 
</div>

Джо

Answer 9

Как и в MVC 5, если вы хотите добавить какие-либо атрибуты, вы можете просто сделать

 @Html.EditorFor(m => m.Name, new { htmlAttributes = new { @required = "true", @anotherAttribute = "whatever" } })

Информация найдена в этом блоге

Answer 10

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

[StringLength(100)]
public string Body { get; set; }

Это известно как System.ComponentModel.DataAnnotations. Если вы не можете найти ValidationAttribute, что вам нужно, вы всегда можете определить пользовательские атрибуты.

С наилучшими пожеланиями, Карлос

Answer 11

Возможно, это не самое удачное решение, но оно простое. Вы можете написать расширение для класса HtmlHelper.EditorFor. В этом расширении вы можете указать параметр options, который будет записывать параметры в ViewData для помощника. Вот некоторый код:

Во-первых, метод расширения:

public static MvcHtmlString EditorFor<TModel, TProperty>(this HtmlHelper<TModel> helper, Expression<Func<TModel, TProperty>> expression, TemplateOptions options)
{
    return helper.EditorFor(expression, options.TemplateName, new
    {
        cssClass = options.CssClass
    });
}

Далее объект параметров:

public class TemplateOptions
{
    public string TemplateName { get; set; }
    public string CssClass { get; set; }
    // other properties for info you'd like to pass to your templates,
    // and by using an options object, you avoid method overload bloat.
}

И, наконец, вот строка из шаблона String.ascx:

<%= Html.TextBox("", ViewData.TemplateInfo.FormattedModelValue, new { @class = ViewData["cssClass"] ?? "" }) %>

Честно говоря, я думаю, что это просто и ясно для бедной души, которая должна поддерживать ваш код в будущем. И это легко расширить для различной информации, которую вы хотели бы передать своим шаблонам. Пока что это хорошо работает для меня в проекте, где я пытаюсь как можно больше обернуть в набор шаблонов, чтобы помочь стандартизировать окружающий HTML, например, http://bradwilson.typepad.com/blog/2009/10/ ASPnet-2-MVC-шаблоны-часть-5-мастер-страниц templates.html .

Answer 12

Я не знаю, почему это не работает для Html.EditorFor, но я попробовал TextBoxFor, и это сработало для меня.

@Html.TextBoxFor(m => m.Name, new { Class = "className", Size = "40"})

... а также проверки работоспособности.

Answer 13

В своей практике я обнаружил, что лучше всего использовать EditorTemplates только с одним HtmlHelper - TextBox, который в большинстве случаев есть. Если мне нужен шаблон для более сложной структуры HTML, я напишу отдельный HtmlHelper.

Учитывая, что мы можем прикрепить весь объект ViewData вместо htmlAttributes TextBox. Кроме того, мы можем написать некоторый код настройки для некоторых свойств ViewData, если они требуют специальной обработки:

@model DateTime?

@*
    1) applies class datepicker to the input;
    2) applies additionalViewData object to the attributes of the input
    3) applies property "format" to the format of the input date.
*@

@{
    if (ViewData["class"] != null) { ViewData["class"] += " datepicker"; }
    else { ViewData["class"] = " datepicker"; }
    string format = "MM/dd/yyyy";
    if (ViewData["format"] != null)
    {
        format = ViewData["format"].ToString();
        ViewData.Remove("format");
    }
}

@Html.TextBox("", (Model.HasValue ? Model.Value.ToString(format) : string.Empty), ViewData)

Ниже приведены примеры синтаксиса в представлении и выведенном html:

@Html.EditorFor(m => m.Date)

<input class="datepicker" data-val="true" data-val-required="&amp;#39;Date&amp;#39; must not be empty." id="Date" name="Date" type="text" value="01/08/2012">

@Html.EditorFor(m => m.Date, new { @class = "myClass", @format = "M/dd" })

<input class="myClass datepicker" data-val="true" data-val-required="&amp;#39;Date&amp;#39; must not be empty." id="Date" name="Date" type="text" value="1/08">

Answer 14

Потому что вопрос задан для Редактор для не текстовое поле, поскольку предложение WEFX не работает.

Для изменения отдельных полей ввода вы можете обработать выходные данные метода EditorFor:

<%: new HtmlString(Html.EditorFor(m=>m.propertyname).ToString().Replace("class=\"text-box single-line\"", "class=\"text-box single-line my500pxWideClass\"")) %>

Также возможно изменить ВСЕ ваши EditorFors, поскольку оказывается, что MVC устанавливает класс текстовых полей EditorFor с помощью .текстовоеполе, поэтому вы можете просто переопределить этот стиль в своей таблице стилей или на странице.

.text-box {
    width: 80em;
}

Кроме того, вы могли бы задать стиль для

input[type="text"] {
    width: 200px;
}

• это переопределяет .text-box и изменит все текстовые поля ввода, EditorFor или иным образом.

Answer 15

У меня также была проблема с установкой ширины текстового поля в MVC3, в то время как установка атрибута Clsss работала для элемента управления TextArea, но не для элемента управления TextBoxFor или EditorFor:

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

@Html.TextBoxFor(модель => модель.Заголовок, создать { Class = "Текстовое поле", style = "ширина: 90%;" })

также в этом случае проверки работают безукоризненно.

Answer 16

Один из способов обойти это - использовать делегатов в модели представления для распечатки специального рендеринга, подобного этому. Я сделал это для класса подкачки, я выставил открытое свойство модели Func<int, string> RenderUrl, чтобы справиться с этим.

Итак, определите, как будет записан пользовательский бит:

Model.Paging.RenderUrl = (page) => { return string.Concat(@"/foo/", page); };

Выведите представление для класса Paging:

@Html.DisplayFor(m => m.Paging)

... и для фактического <=> вида:

@model Paging
@if (Model.Pages > 1)
{
    <ul class="paging">
    @for (int page = 1; page <= Model.Pages; page++)
    {
        <li><a href="@Model.RenderUrl(page)">@page</a></li>
    }
    </ul>
}

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

Answer 17

UPDATE: хм, очевидно, это не сработает, потому что модель передается по значению, поэтому атрибуты не сохраняются; но я оставляю этот ответ как идею.

Еще одним решением, я думаю, будет добавление ваших собственных помощников TextBox / etc, которые будут проверять ваши собственные атрибуты в модели.

public class ViewModel
{
  [MyAddAttribute("class", "myclass")]
  public string StringValue { get; set; }
}

public class MyExtensions
{
  public static IDictionary<string, object> GetMyAttributes(object model)
  {
     // kind of prototype code...
     return model.GetType().GetCustomAttributes(typeof(MyAddAttribute)).OfType<MyAddAttribute>().ToDictionary(
          x => x.Name, x => x.Value);
  }
}

<!-- in the template -->
<%= Html.TextBox("Name", Model, MyExtensions.GetMyAttributes(Model)) %>

Это проще, но не так удобно / гибко.

Answer 18

Это самый чистый и самый элегантный / простой способ получить решение здесь.

Блестящий пост в блоге и без лишних сложностей в написании пользовательских расширений / вспомогательных методов, как сумасшедший профессор.

http: // geekswithblogs.net/michelotti/archive/2010/02/05/mvc-2-editor-template-with-datetime.aspx

Answer 19

Мне очень понравился ответ @tjeerdans, который использует EditorTemplate с именем String.ascx в папке / Views / Shared / EditorTemplates. Кажется, это самый прямой ответ на этот вопрос. Тем не менее, я хотел шаблон с использованием синтаксиса Razor. Кроме того, кажется, что MVC3 использует шаблон String по умолчанию (см. Вопрос StackOverflow &; шаблон отображения mvc для строк используется для целых чисел ") поэтому вам необходимо установить модель для объекта, а не строки. Кажется, мой шаблон работает до сих пор:

@model object 

@{  int size = 10; int maxLength = 100; }

@if (ViewData["size"] != null) {
    Int32.TryParse((string)ViewData["size"], out size); 
} 

@if (ViewData["maxLength"] != null) {
    Int32.TryParse((string)ViewData["maxLength"], out maxLength); 
}

@Html.TextBox("", Model, new { Size = size, MaxLength = maxLength})

Answer 20

Я решил это !!
Для Razor синтаксис такой:
@Html.TextAreaFor(m=>m.Address, new { style="Width:174px" }) это регулирует ширину текстовой области в соответствии с шириной, определенной в параметре style.
Для ASPx синтаксис:
<%=Html.TextAreaFor(m => m.Description, new { cols = "20", rows = "15", style="Width:174px" })%>
это сделает свое дело