I have a field where the user can enter some text that will be shown in another div on the page. It also get saved to the database (MSSQL).

When refreshing the page the saved text will be loaded and can be edited. As soon as the text is edited the div will also be live updated. To make linebreaks working i made a quick linebreak replacement method that should cover all cases of linebreaks.

let content = Tooltip.GetText(); // Tooltip is a Devexpress Memo Control
let content1 = content.replace("\r\n", "<br />");
let content2 = content1.replace("\n\r", "<br />");
let content3 = content2.replace("\n", "<br />");
let content4 = content3.replace("\r", "<br />");

While this will work for linebreaks that got loaded from the database it will not work for linebreaks the user just entered. However, the linebreak will work after a refresh of the page.

Here is a screenshot of my current debugging result. You can clearly see that the first of the two linebreaks got replaced but not the second one. I want to understand why.

I tried to copy the debugging content from the console to Notepad++ to have a look at the specific character, but it looks like that Notepadd++, Windows or Chrome change the data when copying it. Notepad++ will show for both \n\r

I have a field where the user can enter some text that will be shown in another div on the page. It also get saved to the database (MSSQL).

When refreshing the page the saved text will be loaded and can be edited. As soon as the text is edited the div will also be live updated. To make linebreaks working i made a quick linebreak replacement method that should cover all cases of linebreaks.

let content = Tooltip.GetText(); // Tooltip is a Devexpress Memo Control
let content1 = content.replace("\r\n", "<br />");
let content2 = content1.replace("\n\r", "<br />");
let content3 = content2.replace("\n", "<br />");
let content4 = content3.replace("\r", "<br />");

While this will work for linebreaks that got loaded from the database it will not work for linebreaks the user just entered. However, the linebreak will work after a refresh of the page.

Here is a screenshot of my current debugging result. You can clearly see that the first of the two linebreaks got replaced but not the second one. I want to understand why.

I tried to copy the debugging content from the console to Notepad++ to have a look at the specific character, but it looks like that Notepadd++, Windows or Chrome change the data when copying it. Notepad++ will show for both \n\r

• javascript
• typescript
• replace
• devexpress

Share Improve this question Follow edited Jan 5, 2018 at 15:26 Mischa asked Oct 13, 2017 at 11:58 MischaMischa 1,3331212 silver badges2424 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 6

Try with this:

let content1 = content.replace(/\r\n/g, "<br />");
let content2 = content1.replace(/\n\r/g, "<br />");
let content3 = content2.replace(/\n/g, "<br />");
let content4 = content3.replace(/\r/g, "<br />");

Your problem is that .replace function replaces just the first occurrence unless you pass a regex with the global flag.