How to wrap comma separated string onto new line in td cell?

Question

I've one column in a table that contains comma separated emails in each cell of that column.

So for example a cell may contain the following and cell displays email inline. Instead of breaking the second email onto a newline:

[email protected],[email protected]

Question:

How can you wrap comma separated strings onto new line in td cell?

What I've tried:

I can't statically set a <br/> between the emails as they are being read back from a database dynamically.

I did also try adding a span within the td and applying a custom CSS style wrap-emails. But this style doesn't display the emails stacked as expected in the cell:

CSS style:

span.wrap-emails { 
    word-wrap:break-word

} 

Cell definition:

 <td><span class="wrap-emails">@row.Contact_Emails</span></td>

Answer 1

You should be able to replace the commas with brs using the following in your razor:

@Html.Raw(row.Contact_Emails.Replace(",","<br>"))

The Html.Raw bit is so that it renders the br instead of encoding it