EditorFor () ve html özellikleri

Asp.Net MVC 2.0 önizleme yapıları,

Html.EditorFor(c => c.propertyname)

Özellik adı dize ise, yukarıdaki kod bir metin kutusu oluşturur.

MaxLength ve Size özelliklerini metin kutusuna veya kendi css sınıfı özelliğime geçirmek istersem ne olur?

Uygulamamdaki her boyut ve uzunluk kombinasyonu için bir şablon oluşturmam gerekir mi? Eğer öyleyse, bu, kullanılabilir varsayılan şablonları yapmaz.

MVC3'te genişliği şu şekilde ayarlayabilirsiniz:

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

Bunu, / Views / Shared / EditorTemplates klasörümde String.ascx adlı bir EditorTemplate oluşturarak çözdüm:

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

Benim görüşüme göre, kullanıyorum

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

Benim için bir cazibe gibi çalışıyor!

@ Html.EditorFor için HTML özniteliklerini ayarlamayla ilgili bu veya başka herhangi bir başlıktaki yanıtların hiçbiri bana çok yardımcı olmadı. Ancak, harika bir cevap buldum

@ Html.EditorFor helper stil oluşturma

Aynı yaklaşımı kullandım ve çok fazla ekstra kod yazmadan güzelce çalıştı. Html.EditorFor'un html çıktısının id özniteliğinin ayarlandığını unutmayın. Görünüm kodu

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

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

Veri ek açıklamasına ve "gg MMM yyyy" olarak tarih biçimlendirmesine sahip model özelliği

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

Çok fazla ekstra kod yazmadan bir cazibe gibi çalıştı. Bu yanıt, ASP.NET MVC 3 Razor C # kullanır.

Kiran Chand'ın Blog gönderisine bakmak isteyebilir , aşağıdaki gibi görünüm modelinde özel meta veriler kullanır:

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

Bu, meta verilerden yararlanan özel şablonlarla birleştirilir. Bence temiz ve basit bir yaklaşım, ancak mvc'de yerleşik olan bu yaygın kullanım durumunu görmek istiyorum.

Kimsenin onu "ek Görünüm Verileri" içinde geçirip diğer tarafta okumasından bahsetmediğine şaşırdım.

Görünüm (netlik için satır sonlarıyla):

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

Düzenleyici şablonu:

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

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

Sorun şu ki, şablonunuz birkaç HTML öğesi içerebilir, bu nedenle MVC, boyutunuzu / sınıfınızı hangisine uygulayacağını bilemez. Kendin tanımlaman gerekecek.

Şablonunuzun TextBoxViewModel adlı kendi sınıfınızdan türetilmesini sağlayın:

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
  }

}

Şablonda şunları yapabilirsiniz:

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

Size göre şunları yaparsınız:

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

İlk form, dizge için varsayılan şablonu oluşturacaktır. İkinci form, özel şablonu oluşturacaktır.

Alternatif sözdizimi akıcı arayüzü kullanır:

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

Bunu görünümde yapmak yerine, bunu denetleyicide veya ViewModel'de çok daha iyi yapabileceğinize dikkat edin:

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

Ayrıca, / etc öznitelikleri için temel desteği içerecek olan temel TemplateViewModel sınıfını - tüm görünüm şablonlarınız için ortak bir zemin - yapabileceğinizi unutmayın.

Ancak genel olarak MVC v2'nin daha iyi bir çözüme ihtiyacı olduğunu düşünüyorum. Hala Beta - git sor ;-)

Bence CSS kullanmanın yolu. Keşke XAML'de olduğu gibi .NET kodlamasıyla daha fazlasını yapabilseydim, ancak tarayıcıda CSS kraldır.

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>

Joe

MVC 5'te olduğu gibi, herhangi bir özellik eklemek isterseniz, yapmanız gereken

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

Bu blogdan bilgiler bulundu

Mülkleriniz için nitelikler tanımlayabilirsiniz.

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

Bu olarak bilinir System.ComponentModel.DataAnnotations. ValidationAttributeİhtiyacınız olanı bulamazsanız, her zaman özel öznitelikler tanımlayabilirsiniz.

Saygılarımızla, Carlos

Bu en akıllıca çözüm olmayabilir, ancak basittir. HtmlHelper.EditorFor sınıfına bir uzantı yazabilirsiniz. Bu uzantıda, seçenekleri yardımcı için ViewData'ya yazacak bir seçenekler parametresi sağlayabilirsiniz. İşte bazı kodlar:

İlk olarak, uzantı yöntemi:

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

Ardından seçenekler nesnesi:

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

Ve son olarak, String.ascx şablonundaki satır:

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

Açıkçası, kodunuzu yolda tutmak zorunda olan zavallılar için bunun basit ve açık olduğunu düşünüyorum. Şablonlarınıza aktarmak istediğiniz diğer çeşitli bilgi parçalarını genişletmek de kolaydır. Şu ana kadar, çevredeki html'yi standartlaştırmaya yardımcı olmak için bir şablon kümesine elimden geldiğince sarmaya çalıştığım bir projede benim için iyi çalışıyor, a la http://bradwilson.typepad.com/blog/2009/ 10 / aspnet-mvc-2-templates-part-5-master-page-templates.html .

Kendi sorumu cevaplamak için bir blog yazısı yazdım

Şablonlar için html öznitelik desteği ekleme - ASP.Net MVC 2.0 Beta

Html.EditorFor için neden çalışmadığını bilmiyorum ama TextBoxFor'u denedim ve benim için çalıştı.

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

... ve ayrıca doğrulama da çalışır.

Uygulamamda EditorTemplates'i içinde yalnızca bir HtmlHelper ile kullanmanın en iyisi olduğunu buldum - çoğu durumda TextBox. Daha karmaşık html yapısı için bir şablon istiyorsam, ayrı bir HtmlHelper yazacağım.

TextBox'ın htmlAttributes yerine tüm ViewData nesnesini yapıştırabildiğimiz için. Ek olarak, özel işleme ihtiyaç duymaları halinde, ViewData'nın bazı özellikleri için bazı özelleştirme kodları yazabiliriz:

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

Aşağıda, görünümdeki söz dizimi ve çıktısı alınan html örnekleri verilmiştir:

@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">

Çünkü soru EditorFor için not TextBoxFor WEFX'in önerisi için çalışmıyor.

Tek tek giriş kutularını değiştirmek için EditorFor yönteminin çıktısını işleyebilirsiniz:

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

TÜM EditorFors'ınızı değiştirmek de mümkündür, çünkü MVC, EditorFor metin kutularının sınıfını .text-box ile ayarlar , bu nedenle bu stili sadece stil sayfanızda veya sayfada geçersiz kılabilirsiniz.

.text-box {
    width: 80em;
}

Ek olarak, stilini ayarlayabilirsiniz.

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

• bu .text-box'ı geçersiz kılar ve EditorFor veya diğer tüm giriş metin kutularını değiştirir.

Ayrıca, Clsss özniteliğini ayarlamak TextArea denetimi için çalışırken ancak TextBoxFor denetimi veya EditorFor denetimi için çalışmazken, MVC3'te TextBox genişliğini ayarlama konusunda sorun yaşadım:

Aşağıdakileri denedim ve bu benim için çalıştı:

@ Html.TextBoxFor (model => model.Title, yeni {Class = "textBox", style = "width: 90%;"})

Ayrıca bu durumda Doğrulamalar mükemmel çalışıyor.

Bunu aşmanın bir yolu, bunun gibi özel oluşturmayı yazdırmak için görünüm modelinde delegelere sahip olmaktır. Bunu bir çağrı sınıfı için yaptım, model üzerinde bir kamu malı ifşa ediyorumFunc<int, string> RenderUrl , bununla başa çıkmak .

Bu nedenle, özel bitin nasıl yazılacağını tanımlayın:

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

PagingSınıf için görünümün çıktısını alın:

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

... ve gerçek Paginggörünüm için:

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

Aşırı karmaşık konular olarak görülebilir, ancak bu çağrı cihazlarını her yerde kullanıyorum ve aynı standart kodu işlenmeleri için görmeye dayanamıyorum.

GÜNCELLEME: hm, açıkçası bu işe yaramayacak çünkü model değer tarafından geçirildiğinden öznitelikler korunmaz; ama bu yanıtı fikir olarak bırakıyorum.

Bence başka bir çözüm, model üzerinde kendi özniteliklerinizi kontrol edecek kendi TextBox / etc yardımcılarınızı eklemek olacaktır.

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

Bu daha kolay ama o kadar rahat / esnek değil.

Bu, burada bir çözüm bulmanın en temiz ve en zarif / basit yoludur.

Harika bir blog yazısı ve çılgın bir profesör gibi özel uzantı / yardımcı yöntemler yazarken aşırıya kaçmayın.

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

/ Views / Shared / EditorTemplates klasöründe String.ascx adlı EditorTemplate kullanan @tjeerdans yanıtını gerçekten beğendim. Bu soruya verilecek en basit cevap gibi görünüyor. Ancak, Razor sözdizimini kullanan bir şablon istedim. Ek olarak, MVC3'ün String şablonunu varsayılan olarak kullandığı görülmektedir (" dizeler için mvc görüntüleme şablonu tamsayılar için kullanılır " StackOverflow sorusuna bakın ), bu nedenle modeli dizeden ziyade nesneye ayarlamanız gerekir. Şablonum şu ana kadar çalışıyor gibi görünüyor:

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

Ben çözdüm !!
Razor için sözdizimi şudur:
@Html.TextAreaFor(m=>m.Address, new { style="Width:174px" })bu, metin alanı genişliğini stil parametresinde tanımladığım genişliğe ayarlar.
ASPx için sözdizimi şu şekildedir:
<%=Html.TextAreaFor(m => m.Description, new { cols = "20", rows = "15", style="Width:174px" })%>
bu hile yapacak