Поддерживать пробелы при отображении текста из базы данных

Question

Я выставляю таблицу, в которой отображаются значения из таблицы.Одно из полей поступает из ввода текстовой области.

Если я использую этот метод, то пробел сохраняется:

@Html.TextAreaFor(model => model.goalDescr, new { cols="90", rows="3", @readonly = "true"})

- пример:

эй

там

- конец примера

Однако мне не очень нравится этот вид, так как он все еще выглядит как поле формы.Я пытался использовать displayfor, но пробел удаляется, и весь текст занимает одну строку.

@Html.DisplayFor(model => model.goalDescr)

- пример:

привет

- конец примера

Есть ли способ отобразить текст в моем представлении внутри элемента формы и за его пределами и сохранить пробел?

Answer 1

оберните содержимое вашей БД в предварительный тег

<code><pre>
 All whitespaces      and linebreaks
are preserved

Answer 2

Как сказал Стив B , вы можете использовать <pre> для сохранения пробела.

Если, однако, вам не нравится автоматическое форматирование, которое делает <pre>, и хотите сохранитьваш унаследованный стиль просто использует <span> или <div> с атрибутом style="white-space:pre-wrap;".Я считаю это более элегантным решением.

Живая демоверсия

Answer 3

Вы можете написать собственный помощник, который заменит новые строки (\r\n) тегами <br/>.

public static class HtmlExtensions
{
    public static IHtmlString FormatValue(this HtmlHelper html, string value)
    {
        if (string.IsNullOrEmpty(value))
        {
            return MvcHtmlString.Empty;
        }
        value = string.Join(
            "<br/>", 
            value.Split(new[] { Environment.NewLine }, StringSplitOptions.None)
                 .Select(x => html.Encode(x))
        );
        return MvcHtmlString.Create(value);
    }
}

и затем:

@Html.FormatValue(Model.goalDescr)

или добавьте тег <pre> для сохранения новых строк:

<code><pre>
    @Html.DisplayFor(x => x.goalDescr)

Answer 4

Когда вы используете DisplayFor, я предполагаю, что он рендерит input type="text" вместо textarea, и именно поэтому он отображается в одной строке.

Вы можете украсить свою модель с помощью [DataType(DataType.MultilineText)] следующим образом:

[DataType(DataType.MultilineText)]
public string goalDescr { get; set; }