Différences entre Html.TextboxFor et Html.EditorFor dans MVC et Razor


170

Pourquoi ont-ils été modifiés par défaut lors de l'ajout d'une nouvelle vue "édition"? Quels sont les avantages de l'utilisation de EditorFor()vs. TextboxFor()?

j'ai trouvé ça

Par défaut, les échafaudages Créer et Modifier utilisent désormais l'assistant Html.EditorFor au lieu de l'assistant Html.TextBoxFor. Cela améliore la prise en charge des métadonnées sur le modèle sous la forme d'attributs d'annotation de données lorsque la boîte de dialogue Ajouter une vue génère une vue.


5
quelqu'un a-t-il un exemple de la façon dont cela se fait? par exemple rédiger un éditeur pour un DatePicker?
ShaneKm

Réponses:


166

L'avantage de EditorForest que votre code n'est pas lié à un fichier <input type="text". Donc, si vous décidez de changer quelque chose à l'aspect de la façon dont vos zones de texte sont rendues, comme les envelopper dans un, divvous pouvez simplement écrire un modèle d'éditeur personnalisé ( ~/Views/Shared/EditorTemplates/string.cshtml) et toutes vos zones de texte dans votre application bénéficieront automatiquement de ce changement alors que si vous avez codé en dur Html.TextBoxForvous devra le modifier partout. Vous pouvez également utiliser les annotations de données pour contrôler la façon dont cela est rendu.


Il y a un bug, probablement dans une ancienne version. EditorFor ne reconnaît pas «double». Pour 'long', il le considère comme 'int' et step = "0.01" ne fonctionne pas dans les attributs, j'ai donc utilisé TextBoxFor et ajouté @ type = 'number' @ step = "0.01" donc ça a fonctionné
Charlie

129

TextBoxFor : Il sera rendu comme un élément HTML d'entrée de texte correspondant à l'expression spécifiée. En un mot simple, il sera toujours rendu comme une zone de texte d'entrée quel que soit le type de données de la propriété qui se lie avec le contrôle.

EditorFor : Ce contrôle est un peu intelligent. Il rend le balisage HTML basé sur le type de données de la propriété. Par exemple, supposons qu'il existe une propriété booléenne dans le modèle. Pour rendre cette propriété dans la vue sous forme de case à cocher, nous pouvons utiliser CheckBoxFor ou EditorFor. Les deux généreront le même balisage.

Quel est l'avantage d'utiliser EditorFor?

Comme nous le savons, en fonction du type de données de la propriété, il génère le balisage html. Supposons donc demain si nous changeons le type de données de propriété dans le modèle, pas besoin de changer quoi que ce soit dans la vue. Le contrôle EditorFor changera automatiquement le balisage html.


15
excellente réponse simple qui peut facilement être absorbée même par un novice.
Kings


Y a-t-il déjà un cas où vous devriez absolument utiliser TextBoxFor?
eaglei22

55

Le Html.TextboxForcrée toujours une zone de texte ( <input type="text" ...).

Pendant que EditorFor examine le type et les méta-informations, il peut rendre un autre contrôle ou un modèle que vous fournissez.

Par exemple, pour les propriétés DateTime, vous pouvez créer un modèle qui utilise jQuery DatePicker.


12
Un exemple sur la façon d'implémenter jquery datepicker en utilisant editfor?
Pérou

2
merci d'avoir simplifié la différence en utilisant le cas date-heure.
Kings

1
@Peru, ici ou ici est de savoir comment implement jquery datepickeret l' utiliser avec EditorForest ici
shaijut

8

C'est l'une des différences fondamentales non mentionnées dans les commentaires précédents: la
Readonlypropriété fonctionnera avec la zone de texte pour et elle ne fonctionnera pas avec EditorFor.

@Html.TextBoxFor(model => model.DateSoldOn, new { @readonly = "readonly" })

Le code ci-dessus fonctionne, où, comme pour le suivi, vous ne pouvez pas faire de contrôle en lecture seule .

@Html.EditorFor(model => model.DateSoldOn, new { @readonly = "readonly" })

16
Vous pouvez créer EditorFor en lecture seule en utilisant la syntaxe suivante: @ Html.EditorFor (model => model.DateSoldOn, new {htmlAttributes = new {@readonly = "readonly"}})
Doug Knudsen

4

Il existe également une légère différence dans la sortie html pour un type de données chaîne.

Html.EditorFor:  
<input id="Contact_FirstName" class="text-box single-line" type="text" value="Greg" name="Contact.FirstName">

Html.TextBoxFor:
<input id="Contact_FirstName" type="text" value="Greg" name="Contact.FirstName">

2
c'est une réponse absolument erronée, car la principale différence est que Texbox renvoie input et editorfor retourne votre modèle où input est le modèle par défaut pour editorfor.
Artem G
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.