[c#] EditorFor () 및 html 속성

Asp.Net MVC 2.0 미리보기 빌드는 다음과 같은 도우미를 제공합니다.

Html.EditorFor(c => c.propertyname)

속성 이름이 문자열이면 위 코드는 texbox를 렌더링합니다.

MaxLength 및 Size 속성을 텍스트 상자 또는 자체 CSS 클래스 속성에 전달하려면 어떻게해야합니까?

응용 프로그램의 각 크기 및 길이 조합에 대해 하나의 템플릿을 만들어야합니까? 그렇다면 기본 템플릿을 사용할 수 없습니다.

답변

MVC3에서는 다음과 같이 너비를 설정할 수 있습니다.

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

답변

내 / Views / Shared / EditorTemplates 폴더에 String.ascx라는 EditorTemplate을 만들어이 문제를 해결했습니다.

<%@ 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 }) %>

나를위한 매력처럼 작동합니다!

답변

@ Html.EditorFor에 대한 HTML 속성 설정에 대한이 스레드 또는 다른 스레드의 답변 중 어느 것도 나에게 많은 도움이되지 않았습니다. 그러나 나는 좋은 대답을 찾았다.

@ Html.EditorFor 도우미 스타일 지정

나는 동일한 접근 방식을 사용했으며 많은 추가 코드를 작성하지 않고도 아름답게 작동했습니다. Html.EditorFor의 html 출력의 id 속성이 설정되어 있습니다. 보기 코드

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

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

데이터 주석 및 날짜 형식이 “dd MMM yyyy”인 모델 속성

[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 #을 사용합니다.

답변

Kiran Chand의 블로그 게시물 을보고 싶을 수 있습니다 . 그는 뷰 모델에서 다음과 같은 사용자 지정 메타 데이터를 사용합니다.

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

이것은 메타 데이터를 사용하는 사용자 지정 템플릿과 결합됩니다. 제 생각에는 깨끗하고 간단한 접근 방식이지만 mvc에 내장 된이 일반적인 사용 사례를보고 싶습니다.

답변

나는 아무도 그것을 “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"])) %>

답변

문제는 템플릿에 여러 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) %>

뷰에서이 작업을 수행하는 대신 컨트롤러에서이 작업을 수행하거나 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 클래스 (모든 뷰 템플릿의 공통 기반)를 만들 수 있습니다.

그러나 일반적으로 MVC v2에는 더 나은 솔루션이 필요하다고 생각합니다. 아직 베타입니다-가서 물어보세요 😉

답변

CSS를 사용하는 것이 방법이라고 생각합니다. XAML에서와 같이 .NET 코딩으로 더 많은 일을 할 수 있기를 원하지만 브라우저에서는 CSS가 왕입니다.

Site.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>

조