web-dev-qa-db-ja.com

ASP.MVCで複数行のEditor-Forの列と行を指定するにはどうすればよいですか?

ASP.MVC 3では、複数行EditorFor(textarea)の列と行を指定するにはどうすればよいですか? [UIHint("MultilineText")]を使用していますが、テキスト領域に属性を追加する方法に関するドキュメントが見つかりません。

必要なHTML:

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

私のMVC 3モデルの関連部分:

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

Razor cshtmlの関連部分:

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

ソース表示で得ているもの:

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

行と列を設定するにはどうすればよいですか?

66
Dan Sorensen

TextAreaForを使用する

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

またはmulti-lineクラスにスタイルを使用します。

このために EditorTemplate と書くこともできます。

131
amit_g

ASP.NET MVC 5では、[DataType(DataType.MultilineText)]属性を使用できます。 TextAreaタグをレンダリングします。

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

次に、ビューで行を指定する必要がある場合は、次のようにします。

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

または、適切なオーバーロードでTextAreaForを使用します。

@Html.TextAreaFor(model => model.MyField, 10, 20, null)
26

これは、私が信じているより少ない努力で使用することもできます(しかし、MVC 5にいます)

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

enter image description here

1つのオプションは、CSSを使用してtextareaをスタイルすることです

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

SOのこのエントリ または this one。 を参照してください

Amurraの受け入れられた答えは、EditorForを使用するとこのクラスが自動的に追加されることを暗示しているようですが、これを確認する必要があります。

編集:確認済みです。そうです、もしあなたがEditorForを使いたいなら、このCSSスタイルを使うことはあなたが探していることをします。

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

mvc 5で

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

。net VBでは、カミソリファイルで次の行と列を制御できます。

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