How to render changeset error messages in LiveView HTML?

Phoenix Forum Questions / Help
, , , ,
1

Hi,

I have a custom changeset error message with multi line string like

"
- error message line 1\n
- error message line 2\n
- error message line 3\n
- error message line 4\n
"

Can I know how this message can be rendered in LiveView like how it is above? How are line breaks rendered in LiveView html through Gettext.dngettext/6 or Gettext.dgettext/4?

As of now, it is getting rendered like

"
- error message line 1\n- 
error message line 2\n - error message
 line 3\n- error message line 4\n
"
1 Like
2

You can use <pre> to preserve formatting of text in the web page.

Alternatively you can generate markup by

  • wrapping whole thing in list <ul> or <ol> and each line in a <li>

  • wrapping with <p> and replacing \n with <br> to make appear in multiple lines.

<%= error_text |> String.replace("\n", "<br>") |> Phoenix.HTML.raw() %>

You can do all this processing in error_tag function of <YourApp>Web.ErrorHelpers

1 Like