Utilizzo di EditorFor con Twitter Bootstrap per il rendering di un'etichetta di modulo, messaggio di input e convalida

Question

Ho sostituito il modello di editor predefinito (Object.ascx) per produrre l'HTML di forma (corpo) che segue le linee guida di Twitter Bootstrap (http://twitter.github.io/bootstrap/base-css.html#forms) che viene eseguito via Html.EditorForModel().

@if (ViewData.TemplateInfo.TemplateDepth > 1) 
{ 
    @(Model == null ? ViewData.ModelMetadata.NullDisplayText : ViewData.ModelMetadata.SimpleDisplayText) 
} 
else 
{ 
    foreach (var property in ViewData.ModelMetadata.Properties.Where(m => m.ShowForEdit @*&& m.ModelType != typeof (System.Data.EntityState)*@ && !m.IsComplexType && !ViewData.TemplateInfo.Visited(m))) 
    { 
     if (property.HideSurroundingHtml) 
     { 
      @Html.Editor(property.PropertyName) 
     } 
     else 
     { 
      <div class="control-group @(!ViewData.ModelState.IsValidField(property.PropertyName) ? "error" : ViewData.ModelState.ContainsKey(property.PropertyName) ? "success" : "")"> 
       @if (!string.IsNullOrEmpty(Html.Label(property.PropertyName).ToHtmlString())) 
       { 
        @Html.Label(property.GetDisplayName() + (property.IsRequired ? " *" : ""), new { @class = "control-label" }) 
       } 

       <div class="controls"> 
        @Html.Editor(property.PropertyName) 
        @Html.ValidationMessage(property.PropertyName, "*", new { @class = "help-inline" }) 
       </div> 
      </div> 
     } 
    } 
} 

Questo funziona bene a meno che non desideri modificare il modulo (ad esempio, modificare l'ordinamento o aggiungere i campi). Fondamentalmente voglio separare parte del codice sopra in un altro modello di editor, che ha provocato Property.ascx. Questo renderà un'etichetta, un input e un messaggio di convalida per una determinata proprietà, eseguito tramite Html.Editor ("{PropertyName"}) o Html.EditorFor (m => m. {PropertyName}).

<div class="control-group @(!ViewData.ModelState.IsValidField(ViewData.ModelMetadata.PropertyName) ? "error" : ViewData.ModelState.ContainsKey(ViewData.ModelMetadata.PropertyName) ? "success" : "")"> 
    @if (!string.IsNullOrEmpty(Html.Label(ViewData.ModelMetadata.PropertyName).ToHtmlString())) 
    { 
     @Html.Label(ViewData.ModelMetadata.GetDisplayName() + (ViewData.ModelMetadata.IsRequired ? " *" : ""), new { @class = "control-label" }) 
    } 

    <div class="controls"> 
     @Html.Editor(ViewData.ModelMetadata.PropertyName) 
     @Html.ValidationMessage(ViewData.ModelMetadata.PropertyName, "*", new { @class = "help-inline" }) 
    </div> 
</div> 

Il problema con il modello di editor precedente è che non restituisce l'input corretto per il tipo specificato. Quindi una proprietà data/ora renderà solo una normale casella di testo senza l'attributo type.

Sto andando su questo nel modo giusto? Dovrei usare un helper HTML standard o una vista parziale? Se sì, come gestiamo la natura generica?

Answer 1

MVC 5.1 include una correzione esattamente per questo caso, Bootstrap support for editor templates. È possibile includere le proprietà aggiuntive per il markup fornendo un oggetto anonmyous come secondo parametro per EditorFor

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