Как я могу изменить размер многострочного поля редактора?

Я работаю над проектом MVC с использованием C #. Прямо сейчас я пытаюсь немного настроить свои представления и хочу увеличить текстовые поля.

Я следил за предложениями в этом вопросе, чтобы перейти от однострочного текстового поля к многострочному: Изменение размера Html.TextBox

Теперь я пытаюсь изменить размер этого многострочного поля, но не знаю, где и как это сделать.

Вот фрагменты из моего режима редактирования

<div class="editor-label">
     @Html.LabelFor(model => model.Body)
</div>
<div class="editor-field">
     @Html.EditorFor(model => model.Body)
     @Html.ValidationMessageFor(model => model.Body)
</div>

и из моей модели:

[DataType(DataType.MultilineText)]  
[DisplayName("Body:")]  
public string Body { get; set; }

html c# asp.net-mvc multiline asp.net-mvc-3
person White Island    schedule 25.02.2011    source источник

Ответы (7)


arrow_upward
19
arrow_downward

Я бы сделал это с помощью CSS:

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

а затем в вашем файле CSS определите ширину и высоту до желаемых значений:

.editor-multiline-field textarea {
    width: 300px;
    height: 200px;
}
person Darin Dimitrov    schedule 25.02.2011
comment
У меня это не сработало. Я использовал точный пример выше, и ничего не изменило ширину поля html.editorfor. - person dailyUnknown; 30.05.2016
comment
Мне пришлось удалить текстовое поле из моего настраиваемого многострочного поля .editor, чтобы оно правильно изменило размер - person Moi Hawk; 16.04.2019

arrow_upward
16
arrow_downward

Вы также можете использовать @ Html.TextArea или TextAreaFor

@Html.TextAreaFor(model => model.Text, new { cols = 25, @rows = 5 })
person Pedro Fillastre    schedule 13.04.2012

arrow_upward
8
arrow_downward

В MVC 5 вы можете использовать

    @Html.TextAreaFor(model => model.body, 5, 50,  new { @class = "form-control" } )

Прекрасно работает!

person alikuli    schedule 31.07.2015

arrow_upward
3
arrow_downward

Если вы используете mvc и bootstrap, попробуйте следующее:

@Html.TextAreaFor(model => model.Property, new { @class = "form-control", @rows = 5 })
person Ray Sun    schedule 05.12.2014
comment
editor-multiline-field не сработал для меня, но этот ответ сработал! Спасибо. - person pensum; 15.05.2020

arrow_upward
2
arrow_downward

Чтобы придерживаться ранее созданного стиля просмотра, вы также можете сделать это:

<div class="col-md-10 editor-multiline-field">
person Mario Silveira    schedule 04.07.2016

arrow_upward
1
arrow_downward

пытаться

@ Html.TextAreaFor (model => model.Descricao, 5, 50, null)

на странице просмотра

person user2268720    schedule 03.06.2014

arrow_upward
1
arrow_downward

Я просто хочу участвовать в MVC 5

  @Html.EditorFor(model => model.Body, 
                  new {htmlAttributes = new {@style="width:yourdesiredwidth;"}
                   })

или используйте собственный класс

person CyberNinja    schedule 22.09.2016