How to make the line break on enterkey in textarea

Question

I have a text area. Where On enter it gives me the perfect line break. But When I render it in some templates it is not showing the line break. How can I rectify it? I don't want to use any jquery supported editor for that.

If you don't want jQuery, why did you add the `jquery` tag? Also, what on earth do you mean? — SLaks, Apr 28 '11 at 14:26
How are you rendering it? PHP, for example, has a function to convert newlines into html BR tags. — James, Apr 28 '11 at 14:28

score 2 · Accepted Answer · edited May 23 '17 at 11:47

2

welcome to Stackoverflow (SO). Information on subjects like this is easy to find here. Check this SO question, or this one. Next time, try searching SO first.

edited May 23 '17 at 11:47

Community

1
1

answered Apr 28 '11 at 14:34

KooiInc

119,216
31
141
177

score 1 · Answer 2 · answered Apr 28 '11 at 14:34

The textarea gives you text, but presumably your templates are outputting HTML.

The text for a line break is \n but the HTML for a line break is <br>. You need to replace the former with the latter when converting between data formats.

(You also need to replace characters with special meaning in HTML (<, >, &, ' and ") with their entity counterparts to avoid XSS problems)

score 0 · Answer 3 · answered Apr 28 '11 at 14:38

((What the hell is a perfect line break?))

I'm guessing that you have a text-area who's text you're saving and then showing it in a div or p or span, and you want the line-breaks to actually show.

There are three ways:

When saving/processing the text, do a search-and-replace for line break characters and replace them with the <br /> element.
Style the element with the white-space:pre; style in CSS.
Wrap it all with the <pre> tag.

How to make the line break on enterkey in textarea

3 Answers3