Why are new lines not working in this javascript alert window?

Question

I see quite a few different issues with the alert window and new lines. Most are that the \n is considered a new line in PHP rather than getting sent to javascript.

In my case, the string is being outputted in a new window showing \n. I just tried actually writing \n into an alert box via jsfiddle, and that worked, so it must be my method of doing things...

Here is the string returned to console. as you can see, the \n is definitely there:

Username is required\nPassword is required\nEmail is required\nPhone is required\nCardnumber is required

However, it shows up like this:

$An alert with \n instead of a new line$

Why is this happening? I think it may have something to do with the data type, as it is returned from $.ajax

if (canAjax && !try_ajax) { 
    e.preventDefault();
    $.ajax({
        type: "POST", 
        url: "mobilesubmit.php",
        data: {"use_ajax": true, "formdata": $("#register_form").first().serializeArray()},
        success: function(data) {

            // This stupid thing should make new lines!
            alert(data);

            console.log(data);
        },
        error: function (request, status, error) {
            try_ajax = true;
            $("#register_form").submit();
        }
    });
}

See this [question/answer](http://stackoverflow.com/questions/1155678/javascript-string-newline-character). — Behrang, Jan 23 '12 at 06:07

score 20 · Accepted Answer · answered Jan 23 '12 at 06:10

20

If your console log is showing \n rather than a new line, then it means the \ is escaped in the original string...

Compare

console.log(1,"\\n\\n");
console.log(2,"\n\n");

Solution

use .replace() to swap your \n with newline characters

console.log(3,"\\n\\n".replace(/\\n/g,"\n"))

answered Jan 23 '12 at 06:10

Billy Moon

57,113
24
136
237

Hah, that's probably it. You posted that while I was writing a wall of text that described the same thing. I'll delete my answer and mark this as correct. This was the issue all along. (I assumed chrome's console would not parse the new line. I'm still not sure where the extra slash is coming from - unless that's standard for ajax return results.) – Radley Sustaire Jan 23 '12 at 06:11

score 4 · Answer 2 · answered Jan 23 '12 at 06:14

The most likely cause of this is that your PHP code is escaping the backslash by adding another backslash in front of it. By the time it gets to your JS code, it's actually

"Username is required\\nPassword is required..."

You can inspect the raw response in the network panel of your debugger. If you try to view it in the console, it'll display the formatted output instead of the raw output.

Double-check your method of JSON serialization in your PHP code and make sure it's doing what you expect with the \n.

"If you try to view it in the console, it'll display the formatted output instead of the raw output." That is what was giving me issues. You nailed it, but Billy Moon had it just before you. Thanks — Radley Sustaire, Jan 23 '12 at 06:38

score 1 · Answer 3 · answered Jan 23 '12 at 06:00

1

try adding a space after \n .It should work

answered Jan 23 '12 at 06:00

Ajeet Sinha

2,315
20
20

Nope, also tried putting the spacing before the \n, and again with a space on both sides. It's getting printed as-is rather than the tag getting parsed into a new line (if that's the correctly terminology). – Radley Sustaire Jan 23 '12 at 06:01
1

Did u try adding
tag just for reference? – Sameera Thilakasiri Jan 23 '12 at 06:02

score 0 · Answer 4 · edited May 24 '18 at 08:33

0

IE11 inspect shows the same problem on an asp.net generated hiddenfield - it displays its value as value="test line 1\ntest line 2"

UT actually contains value="test line 1\\ntest line 2"

Using the element.value.replace(/\\n/g,"\n") on it then displays the correct line spaced string in a javascript alert()

Thanks Billy - saved hours of grief

edited May 24 '18 at 08:33

Robert

5,278
43
65
115

answered May 24 '18 at 08:12

Alan S

1
1

Bathila Sanvidu · Answer 5 · 2022-04-12T04:35:59.257

0

Do not use -> \n

Use this -> \\n

example

alert('Hello Wrold Second line \n\nThanks!') 

// if only above one ddoesn't work use below one!

alert('Hello Wrold Second line \\n\\nThanks!') 
//<!-- Publisher - Bathila Sanvidu Jayasundara -->

edited Apr 12 '22 at 04:35

answered Dec 08 '21 at 15:44

Bathila Sanvidu

121
1
5

This does not provide an answer to the question. Once you have sufficient [reputation](https://stackoverflow.com/help/whats-reputation) you will be able to [comment on any post](https://stackoverflow.com/help/privileges/comment); instead, [provide answers that don't require clarification from the asker](https://meta.stackexchange.com/questions/214173/why-do-i-need-50-reputation-to-comment-what-can-i-do-instead). - [From Review](/review/late-answers/30538840) – Kurt Van den Branden Dec 08 '21 at 18:22
this worked for me – Bathila Sanvidu Dec 09 '21 at 07:35
Please explain why a double backslash works, and a single one not, otherwise this is nothing more than a code only answer. – Kurt Van den Branden Dec 09 '21 at 10:28

Why are new lines not working in this javascript alert window?

5 Answers5

Compare

Solution

Linked