1

How can I in Javascript read strings from a textfile and display them in an alert box with newlines?

Suppose I have an ASCII textfile "messages.txt" containing two lines:

AAA\nBBB\nCCC
DDD\nEEE\nFFF

In javascript, I read the file content and store it in a variable "m":

    var m;
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function ()
      { if ((xmlhttp.readyState==4) && (xmlhttp.status==200 || xmlhttp.status==0))
        { m = xmlhttp.responseText.split('\n'); };
      };
    xmlhttp.open("GET", "messages.txt", false);
    xmlhttp.send(null);

Now when I display the first message with

console.log(m[0]);
alert(m[0]);

it is shown exactly as in the textfile and with no line breaks; i.e

AAA\nBBB\nCCC

and not as

AAA
BBB
CCC

Changing \n to \\n, \r\n, \\r\\n or %0D%0A in the textfile doesn't help; the alert is still displayed as one line including the escape characters without replacing them by newline. Changing the encoding of "messages.txt" from ASCII to UTF-8 didn't help either.

To clarify the problem: When m is read from the file "message.txt", it is split into an array of strings. m[0] equal to "AAA\nBBB\nCCC".

console.log(m[0]);                  // displays AAA\nBBB\nCCC
console.log('AAA\nBBB\nCCC');       // displays AAA
                                    //          BBB
                                    //          CCC

console.log(typeof(m[0])            // displays string
console.log(m[0]=="AAA\nBBB\nCCC"); // displays false

Why is m[0] not equal to "AAA\nBBB\nCCC" (even if exactly this is what is displayed in the console)? I guess, that is the reason why no line breaks appear.

penplan
  • 11
  • 3
  • Change `split('\n')` from single quotes to `split("\n")` to double quotes and see what happens. Single quotes will not intetpret escaped chars where `\n` is escaped. So you get all slashes as escaped as well as other logical errors, unless you split by `"\n"`. – mardubbles Apr 09 '22 at 04:25
  • @mardubbles This did the trick - thanks a lot! – penplan Apr 09 '22 at 04:34
  • Yeah im not on here for rep so you can accept that as an answer. Glad it worked out for you. – mardubbles Apr 09 '22 at 04:37
  • @mardubbles Unfortunately, I was wrong and replacing single with double quotes didn't solve the problem (it changed how the text file is split into an array of string; the array elements still show with an \n and no line breaks) This aside, I am new to stackoverflow and don't know how to accept a comment as an answer. – penplan Apr 09 '22 at 15:41
  • You can't. Comments are not meant to be answers. – Arnav Thorat May 02 '22 at 19:43

2 Answers2

0

you need to add another \ at split('\n') to be split('\\n')

or change the single quote to douple quotes split("\n")

also i encourage you to read this quick article about 'Single' vs "Double" quotes

Omar Tammam
  • 1,217
  • 1
  • 9
  • 17
  • Splitting the string is not the problem; that works fine. I clarified the problem in my initial post: The variable "m[0]" which is equal to "A\nB\nC" does not result in a line break in an alert, whereas `var M = "A\nB\C"; alert(M);` results in linebreaks. – penplan Apr 09 '22 at 16:09
  • I know , please run it as mentioned and you will see that now it sperated – Omar Tammam Apr 09 '22 at 16:12
0

Single quotes don't interpret newline breaks (\n). So, you need to change the quotes in your split() method to have double quotes.

Use the split() function like so.

const str = "Hi! I'm text!\nIsn't this supposed to be newline?";

console.log(str.split("\n"));

This should return an array like so when run.

[
  "Hi! I'm text!",
  "Isn't this supposed to be newline?"
]

This is how to separate your text with line breaks.

For more information, see this other Stack Overflow question.

Arnav Thorat
  • 3,078
  • 3
  • 8
  • 33
  • Splitting the string is not the problem; that works fine. I clarified the problem in my initial post: The variable "m[0]" which is equal to "A\nB\nC" does not result in a line break in an alert, whereas var M = "A\nB\C"; alert(M); results in linebreaks. – penplan Apr 09 '22 at 16:10