Cannot set multiline text in textarea

Question

I have an array, each of its elements in a text line:

a = ['line1', 'line2', 'line3'];

I want to set the text lines into a textarea, displayed like so:

line1
line2
line3

I set the text with the following code:

myTxtArea.value = a.join('\n');

and it shows like this:

line1\nline2\nline3

What to do so that the \n's break lines instead of being displayed?

The textarea HTML:
<textarea autofocus id=laidTxt name=laidTxt class="laidTxt"
placeholder="paste PDF text here">KJHKH DSKJH ...
</textarea>

I see

Does this answer your question? [New line in text area](https://stackoverflow.com/questions/8627902/new-line-in-text-area) — Andam, Oct 08 '20 at 20:36
I'm did some testing and wasn't able to get the same result as your'se. What browser are u using? — Mauricio Sipmann, Oct 08 '20 at 20:50
But your comment is interestinn, bacause it suggests that there might be something in my HTML. I'll post it. — Juan Lanus, Oct 08 '20 at 21:31
@Michel Tried "\n" instead of '\n', same result (IMO in JS both are the same, unlike in shell scripts) — Juan Lanus, Oct 08 '20 at 22:26
@Andam before committing this question I tried a number of the answers in "New line in text area", no luck — Juan Lanus, Oct 08 '20 at 22:28
@Andam Fixed. All answers were OK, it was a remaining piece of code I didn't delete that was introducing the problem. Thanks! — Juan Lanus, Oct 09 '20 at 13:01
@Michel Fixed. All answers were OK, it was a remaining piece of code I didn't delete that was introducing the problem. Thanks! — Juan Lanus, Oct 09 '20 at 13:01
@Mauricio Sipman Fixed. All answers were OK, it was a remaining piece of code I didn't delete that was introducing the problem. Thanks! — Juan Lanus, Oct 09 '20 at 13:02
@tawfik al Fixed. All answers were OK, it was a remaining piece of code I didn't delete that was introducing the problem. Thanks! — Juan Lanus, Oct 09 '20 at 13:02

score 0 · Answer 1 · answered Oct 08 '20 at 21:04

0

try this code

for (let index = 0; index < a.length; index++) {
 myTxtArea.value += a[index]+'\n';

 }

its work with me

answered Oct 08 '20 at 21:04

tawfik al

36
4

Same result. Even replacing '\n' by '\x0A' (it still displays \n's in the textarea. – Juan Lanus Oct 08 '20 at 21:46

score 0 · Answer 2 · answered Oct 08 '20 at 23:57

0

I dont know why it does not work for you but as it shows in the example below it works

a = ['line1', 'line2', 'line3'];

document.getElementById("laidTxt").value = a.join('\n');

<textarea autofocus id="laidTxt"></textarea>

answered Oct 08 '20 at 23:57

Andam

2,087
1
8
21

Juan Lanus · Answer 3 · 2020-10-09T13:33:59.837

0

To clear any doubts, the code I initially posted in the question is OK and works fine.

For the curious: I was applying a JSON.stringify() transformation to the joined lines just before setting them into the textarea.
Like so:
let txt = JSON.stringify( handleText( txtArea.value ) ); txtArea.value = txt;

edited Oct 09 '20 at 13:33

answered Oct 09 '20 at 13:10

Juan Lanus

2,293
23
18

Cannot set multiline text in textarea

3 Answers3