ASP.NET MVC의 EditorFor ()에 대한 HTML 특성

왜 HTML 속성을 전달할 수 EditorFor()없습니까? 예를 들어;

<%= Html.EditorFor(model => model.Control.PeriodType, 
    new { disabled = "disabled", readonly = "readonly" }) %>

메타 데이터를 사용하고 싶지 않습니다

업데이트 : 솔루션은보기에서 이것을 호출했습니다.

 <%=Html.EditorFor( model => model.Control.PeriodEndDate, new {Modifiable=model.Control.PeriodEndDateModifiable})%>

사용 ViewData["Modifiable"]나는 익명 객체에 전달 된 입력에 읽기 전용 및 / 또는 비활성화 속성을 추가할지 여부를 결정합니다 일부 뷰 로직을 내 사용자 지정 EditorTemplates / String.ascx에서이 EditorFor()라는 매개 변수 additionalViewData및 속성이있는 편집기 템플릿에 전달된다 ViewData수집.

EditorFor메타 데이터와 함께 작동하므로 html 속성을 추가하려면 언제든지 할 수 있습니다. 또 다른 옵션은 단순히 사용자 정의 템플릿을 작성하고 다음을 사용하는 것입니다 TextBoxFor.

<%= Html.TextBoxFor(model => model.Control.PeriodType, 
    new { disabled = "disabled", @readonly = "readonly" }) %>    

MVC 5.1 업데이트 는 이제 아래의 접근 방식을 직접 지원하므로 내장 편집기에서도 작동합니다. http://www.asp.net/mvc/overview/releases/mvc51-release-notes#new-features (좋아하는 생각이 들거나 내 대답을 읽는 경우)

최종 업데이트

자체 편집기 템플릿을 사용하거나 MVC 5.1을 사용하는 경우 내장 편집기에서 직접 아래 접근 방식을 지원합니다.

@Html.EditorFor(modelItem => item.YourProperty, 
  new { htmlAttributes = new { @class="verificationStatusSelect", style = "Width:50px"  } })

그런 다음 템플릿에서 (MVC 5.1의 단순 유형에는 필요하지 않음)

@Html.TextBoxFor(m => m, ViewData["htmlAttributes"])

MVC 5.1부터는 다음을 수행 할 수 있습니다.

@Html.EditorFor(model => model, new { htmlAttributes = new { @class = "form-control" }, })

http://www.asp.net/mvc/overview/releases/mvc51-release-notes#new-features

이제 ASP.Net MVC 5.1은이 를 지원합니다.

릴리스 노트에서

이제 EditorFor에서 HTML 속성을 익명 객체로 전달할 수 있습니다.

예를 들면 다음과 같습니다.

@Html.EditorFor(model => model, 
              new { htmlAttributes = new { @class = "form-control" }, })

다음은 MVC 5.1 Editor의 html 속성에 대한 VB.Net 코드 구문입니다.

@Html.EditorFor(Function(x) x.myStringProp, New With {.htmlAttributes = New With {.class = "myCssClass", .maxlength="30"}}))

그냥 사용하지 않는 이유

@Html.DisplayFor(model => model.Control.PeriodType)

메타 데이터를 사용하지 않으려면 [UIHint("PeriodType")]속성을 사용하여 속성을 꾸미거나 복잡한 유형 인 경우 아무 것도 장식하지 않아도됩니다. EditorFor는 EditorTemplates 폴더에서 PeriodType.aspx 또는 ascx 파일을 찾아 대신 사용합니다.

오늘은 nullable bool에 바인딩되는 확인란에 대해 동일한 문제로 씨름하고 있으며 내 코드가 아닌 모델을 변경할 수 없으므로이를 처리하는 더 좋은 방법을 찾아야했습니다. 약간의 무차별 적 인 힘이지만 99 %의 경우에 효과가 있습니다. 분명히 각 입력 유형에 대해 유효한 속성을 수동으로 수집해야하지만 확인란에 대해 모두 얻은 것 같습니다.

내 Boolean.cshtml 편집기 템플릿에서 :

@model bool?

@{
    var attribs = new Dictionary<string, object>();
    var validAttribs = new string[] {"style", "class", "checked", "@class",
        "classname","id", "required", "value", "disabled", "readonly", 
        "accesskey", "lang", "tabindex", "title", "onblur", "onfocus", 
        "onclick", "onchange", "ondblclick", "onmousedown", "onmousemove", 
        "onmouseout", "onmouseover", "onmouseup", "onselect"};
    foreach (var item in ViewData) 
    {
        if (item.Key.ToLower().IndexOf("data_") == 0 || item.Key.ToLower().IndexOf("aria_") == 0) 
        {
            attribs.Add(item.Key.Replace('_', '-'), item.Value);
        } 
        else 
        {
            if (validAttribs.Contains(item.Key.ToLower()))
            {
                attribs.Add(item.Key, item.Value);
            }
        }
    }
}

@Html.CheckBox("", Model.GetValueOrDefault(), attribs)

여전히 EditorFor를 사용할 수 있습니다. 스타일 / html 속성을 ViewData로 전달하십시오.

@Html.EditorFor(model => model.YourProperty, new { style = "Width:50px" })

EditorFor는 템플릿을 사용하여 렌더링하기 때문에 속성의 기본 템플릿을 재정의하고 스타일 속성을 ViewData로 전달할 수 있습니다.

따라서 EditorTemplate은 다음과 같습니다.

@inherits System.Web.Mvc.WebViewPage<object>

@Html.TextBoxFor(m => m, new { @class = "text ui-widget-content", style=ViewData["style"] })

Html.TextBoxFor(model => model.Control.PeriodType, 
    new { @class="text-box single-line"})

당신은 이것처럼 사용할 수 있습니다; 와 동일한 출력 Html.EditorFor및 html 속성을 추가 할 수 있습니다

Views / Shared / EditorTemplates / MyTypeEditor.vbhtml에서 유형에 맞는 템플릿을 만드십시오.

@ModelType MyType

@ModelType MyType
@Code
    Dim name As String = ViewData("ControlId")
    If String.IsNullOrEmpty(name) Then
        name = "MyTypeEditor"
    End If
End Code

' Mark-up for MyType Editor
@Html.TextBox(name, Model, New With {.style = "width:65px;background-color:yellow"})

모델 특성을 사용하여보기에서 편집기를 호출하십시오.

@Html.EditorFor(Function(m) m.MyTypeProperty, "MyTypeEditor", New {.ControlId = "uniqueId"})

VB 구문을 용서하십시오. 그것이 우리가 굴리는 방식입니다.

내 경우에는 추가 속성을받을 수있는 HTML5 숫자 입력 편집기 템플릿을 만들려고했습니다. 더 깔끔한 접근법은 자신의 HTML 도우미를 작성하는 것이지만 이미 .ascx 템플릿이 있으므로이 접근법을 사용했습니다.

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %>
<input id="<%= Regex.Replace(ViewData.TemplateInfo.GetFullHtmlFieldId(""), @"[\[\]]", "_") %>" name="<%= ViewData.TemplateInfo.HtmlFieldPrefix %>" type="number" value="<%= ViewData.TemplateInfo.FormattedModelValue %>"
<% if (ViewData["attributes"] != null)
   {
       Dictionary<string, string> attributes = (Dictionary<string, string>)ViewData["attributes"];
       foreach (string attributeName in attributes.Keys){%>
        <%= String.Format(" {0}=\"{1}\"", attributeName, attributes[attributeName])%>
       <% }
   } %> />

이 못생긴 비트는 숫자 형 입력을 생성하고 "속성"키가있는 ViewData Dictionary를 찾습니다. 키 / 값 쌍을 속성으로 추가하여 사전을 반복합니다. ID 속성의 정규식은 관련이 없으며 컬렉션에 사용될 때 일반적으로 밑줄로 이스케이프 할 GetFullHtmlFieldId()대괄호 []가 포함 된 id를 반환 하기 때문에 존재 합니다.

이 템플릿은 다음과 같이 호출됩니다.

Html.EditorFor(m => m.Quantity, "NumberField", new { attributes = new Dictionary<string, string>() { { "class", "txtQuantity" } } }

장황하지만 작동합니다. 템플릿에서 리플렉션을 사용하여 사전을 사용하는 대신 속성 이름을 속성 이름으로 사용할 수 있습니다.

ViewData컨트롤러에서를 사용하여 조건 설정

ViewData["Modifiable"] = model.recProcessed;

그런 다음 편집기 템플릿에서이 viewdata를 사용하여 컨트롤의 html 속성을 설정하십시오.

@Html.RadioButton(prefix, li.Value, li.Selected, @ViewData["Modifiable"].ToString().ToLower() == "true" ? (object)new  { @id = li.Value, @disabled = "disabled" } : new { @id = li.Value })

MVC 5.1 이상 솔루션 (로컬 HtmlAttributes를 병합하고 EditorTemplates에 정의 됨) :

Shared \ EditorTemplates \ String.cshtml :

@Html.TextBoxFor(model => model, new { @class = "form-control", placeholder = ViewData.ModelMetadata.Watermark }.ToExpando().MergeHtmlAttributes(ViewData["htmlAttributes"].ToExpando()))

확장 :

public static IDictionary<string, object> MergeHtmlAttributes(this ExpandoObject source1, dynamic source2)
{
    Condition.Requires(source1, "source1").IsNotNull().IsLongerThan(0);

    IDictionary<string, object> result = source2 == null
        ? new Dictionary<string, object>()
        : (IDictionary<string, object>) source2;

    var dictionary1 = (IDictionary<string, object>) source1;

    string[] commonKeys = result.Keys.Where(dictionary1.ContainsKey).ToArray();
    foreach (var key in commonKeys)
    {
        result[key] = string.Format("{0} {1}", dictionary1[key], result[key]);
    }

    foreach (var item in dictionary1.Where(pair => !result.ContainsKey(pair.Key)))
    {
        result.Add(item);
    }

    return result;
}

public static ExpandoObject ToExpando(this object anonymousObject)
{
    IDictionary<string, object> anonymousDictionary = new RouteValueDictionary(anonymousObject);
    IDictionary<string, object> expando = new ExpandoObject();
    foreach (var item in anonymousDictionary)
        expando.Add(item);
    return (ExpandoObject)expando;
}

public static bool HasProperty(this ExpandoObject expando, string key)
{
    return ((IDictionary<string, object>)expando).ContainsKey(key);
}

용법:

@Html.EditorFor(m => m.PromotionalCode, new { htmlAttributes = new { ng_model = "roomCtrl.searchRoomModel().promoCode" }})