Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Preserve line breaks in textarea

I have a form with a textarea and I want to preserve line breaks entered by the user when outputting the content.

For exemple, if I write in textarea :

Here is a sentence. Here is another. here is one more.

This is a new paragraph. Here is a new sentence. Here is another.

I want the same output and not :

Here is a sentence. Here is another. here is one more. This is a new paragraph. Here is a new sentence. Here is another.

How could I preserve line breaks?

like image 463
Simon M. Avatar asked Jun 02 '15 10:06

Simon M.


People also ask

How do I preserve line breaks in textarea?

To preserve line breaks when getting text from a textarea with JavaScript, we can replace whitespace characters with '<br>\n' .

How do you store line breaks in database?

Just put the output text between <pre></pre> tags, that will preserve the line breaks.

How do you keep a line break in HTML?

Preserve Newlines, Line Breaks, and Whitespace in HTML If you want your text to overflow the parent's boundaries, you should use pre as your CSS whitespace property. Using white-space: pre wraps still preserves newlines and spaces. Enjoy!

How do you allow new line in textarea?

\n is the linefeed character literal (ASCII 10) in a Javascript string. <br/> is a line break in HTML. Many other elements, eg <p> , <div> , etc also render line breaks unless overridden with some styles.


1 Answers

Generally you just need to add

  • white-space: pre-line; whitespace trimmed to single whitespace or

  • white-space: pre-wrap; all whitespace preserved

to the element's style (CSS), where you want your text rendered with line-breaks.

like image 71
Vaidotas Pocius Avatar answered Sep 21 '22 19:09

Vaidotas Pocius