[FIXED] Jinja render text in HTML preserving line breaks

Issue

I have a simple form like this:

class RecordForm(Form):    
    notes = TextAreaField('Notes')

I record the data in three paragraphs like this:

para1

para2

para3

In the template I would like to see the content of that record in read-only. (Not editable form)

record is this case the model containing the data:

<td>{{ record.notes }}</td>

-->

<td>para1 para2 para3</td>

What can I do to make it to show the multi-lines?

Solution

All whitespace, including newlines, is turned into a single space in HTML.

Your options, from best to worst:

1. Put white-space: pre-wrap; on the containing element. This tells HTML to show all whitespace exactly as it appears in the source, including newlines. (You could also use a <pre> tag, but that will also disable word-wrapping, which you probably don't want.)
2. Treat the plain text as Markdown and throw a Markdown processor at it—one of the things Markdown does is wrap paragraphs in <p>.
3. In Python-land, do .replace('\n', '<br>'). But this leaves you vulnerable to XSS because there might be other HTML-like junk in the string, and fixing that is a bit of a pain.

Answered By - Eevee