web-dev-qa-db-fra.com

Comment spécifier les colonnes et les lignes d'un éditeur multiligne multiligne dans ASP.MVC?

Dans ASP.MVC 3, comment puis-je spécifier les colonnes et les lignes d'une multiligne EditorFor (textarea)? J'utilise [UIHint("MultilineText")], mais je ne trouve aucune documentation sur la manière d'ajouter des attributs pour la zone de texte.

HTML désiré:

 <textarea cols="40" rows="10"></textarea>

Partie pertinente de mon modèle MVC 3:

[UIHint("MultilineText")]
public string Description { get; set; }

Partie pertinente de mon cshtml Razor:

<div class="editor-field">
    @Html.EditorFor(model => model.Description)
</div>

Ce que je reçois dans View Source:

 <div class="editor-field">
     <textarea class="text-box multi-line" id="Description" name="Description"></textarea>
 </div>

Comment définir des lignes et des colonnes?

asp.net-mvcrazordata-annotations
63
Dan Sorensen

Utiliser TextAreaFor

@Html.TextAreaFor(model => model.Description, new { @class = "whatever-class", @cols = 80, @rows = 10 })

ou utilisez le style pour la classe multi-line.

Vous pouvez aussi écrire EditorTemplate pour cela.

125
amit_g

Dans ASP.NET MVC 5, vous pouvez utiliser l'attribut [DataType(DataType.MultilineText)]. Il rendra un TextArea tag.

public class MyModel
{
    [DataType(DataType.MultilineText)]
    public string MyField { get; set; }
}

Ensuite, dans la vue, si vous devez spécifier les lignes, procédez comme suit:

@Html.EditorFor(model => model.MyField, new { htmlAttributes = new { rows = 10 } })

Ou utilisez simplement TextAreaFor avec la surcharge correcte:

@Html.TextAreaFor(model => model.MyField, 10, 20, null)
25
Juan Carlos Puerto

Celui-ci peut également être utilisé avec moins d'effort, je crois (mais je suis dans MVC 5)

@Html.Description(model => model.Story, 20, 50, new { })

 enter image description here

7
Mohammed Dawood Ansari

Une option semble utiliser CSS pour styler la zone de texte

.multi-line { height:5em; width:5em; }

Voir cette entrée sur SO ou celle-ci.

La réponse acceptée d'Amurra semble impliquer que cette classe est ajoutée automatiquement lors de l'utilisation de EditorFor, mais vous devez le vérifier.

EDIT: confirmé, c'est le cas. Donc oui, si vous voulez utiliser EditorFor, utiliser ce style CSS fait ce que vous cherchez.

<textarea class="text-box multi-line" id="StoreSearchCriteria_Location" name="StoreSearchCriteria.Location">
5
Khepri

dans mvc 5 

              @Html.EditorFor(x => x.Address, 
              new {htmlAttributes = new {@class = "form-control", 
                   @placeholder = "Complete Address", @cols = 10, @rows = 10 } })
0
CyberNinja

Dans .net VB -, vous pouvez contrôler les colonnes et les lignes avec les éléments suivants dans votre fichier rasoir:

@Html.EditorFor(Function(model) model.generalNotes, New With {.htmlAttributes = New With {.class = "someClassIfYouWant", .rows = 5,.cols=6}})
0
Cobblestone1