Question

I have a problem with my View in that when I am editing something using TextAreaFor any line breaks or formatting I insert are saved and when I edit the same element, it will still be shown like this:

Need something to keep the family entertained this Winter? Or looking for the perfect Christmas gift? You’ll find both at CD WOW!

With this offer, Members can:

• Search a huge range of music, movies, TV, books and games.

• Get the latest releases direct to your door for Christmas, with free worldwide shipping.

But when I use DisplayFor or just @Model.Property it will display like this:

Need something to keep the family entertained this Winter? Or looking for the perfect Christmas gift? You’ll find both at CD WOW! With this offer, Members can: • Search a huge range of music, movies, TV, books and games. • Get the latest releases direct to your door for Christmas, with free worldwide shipping.

What should I be using to display it in the format shown in TextAreaFor?

Answer 1

You could use the <pre> tag:

<pre>
    @Html.DisplayFor(x => x.Property)
</pre>

Another possibility is to write a custom helper that will replace the new lines (\r\n) with <br/> tags and use it like this:

@Html.DislpayFormattedFor(x => x.Property)

and here’s how the custom helper could be defined:

public static class HtmlExtensions
{
    public static IHtmlString DislpayFormattedFor<TModel>(
        this HtmlHelper<TModel> htmlHelper,
        Expression<Func<TModel, string>> expression
    )
    {
        var value = Convert.ToString(
            ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData).Model
        );
        if (string.IsNullOrEmpty(value))
        {
            return MvcHtmlString.Empty;
        }

        value = string.Join(
            "<br/>",
            value.Split(
                new[] { Environment.NewLine }, 
                StringSplitOptions.None
            ).Select(HttpUtility.HtmlEncode)
        );

        return new HtmlString(value);
    }
}