How can I replace certain carriage return line feed followed by a dash with a <br/>?
How can I replace the sequence ASCII 13 ASCII 10 - (CR LF DASH or /r/n-) in the text inside a TD element in a web page using javascript or jQuery? There are similar quesitons about this in stackoverflow and elsewhere, but the solutions listed don't work on this particular scenario. The incoming HTML is generated dynamically by a piece of my customer's legacy software that is not going to be changed, but it references a javascript file that I can change. A shortened version of the page is given below. The actual page contains between zero and twenty rows of data, some of which contain multiple lines. My users are on Internet Explorer 8 and neither of the two lines below is working. I've tried just replacing the carriage return and just replacing the line feed. I've tried this from javascript and jQuery without any visible effect. When I save the page from Internet Explorer 8 and view it in a hex editor, the carriage return and line feed characters are present in the client. The crux of the problem is exposing the /n in the text to JavaScript.
I want to perform this replacement because I want the two lines of text to appear in the displayed output any time the sequence /r/n- exist in the page in a element.
Note that I've included two versions of the replacement, one jQuery and one JavaScript. Neither does what I want it to do.
<html>
<head>
<title>Page Testing </title>
<script src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('td').each(function () {
$this = $(this);
$this.html($this.html().replace(/\r\n\-/g, "<br/>-"));
this.innerHTML = (this.innerHTML.replace(/\r\n\-/g, "<br/>-"));
});
});
</script>
</head>
<body>
<table>
<tbody>
<tr>
<td>-First Content
-Second Line of Content</td>
<td>-How I want it to look<br/>-After the transformation</td>
</tr>
</tbody>
</table>
</body>
</html>
Answer
Your question says you only care about DISPLAYING them on separate lines, not specifically about replacing the \r\n.
You could consider css to solve this problem.
<style>
tr {
white-space:pre-line;
}
</style>