How to add HTML markup programmatically in a Ruby on Rails view?

Question

I am trying to return a formatted error message in the ActiveControler flash hash. This is rendered in my layout as:

<% flash.each do |name, msg| %>
    #<%= content_tag :p, msg, class: "flash #{name}" %>
<% end %>

When the msg = 'Bob' I get:

<p class="flash error">Bob</p>

Which displays as:

Bob

When the msg = '

Bob

' I get:

<p class="flash error">"<ol><li>Bob</li></ol>"</p>

Which displays as:

<ol><li>Bob</li></ol>

What I want is to have it displayed as an ordered list of error messages.

I have also tried changing out the content_tag helper for straight hand coded markup and that doesn't change anything. I also tried replacing "<" and ">" with < and >. Of course that didn't help either. I know I can give up on this and write a custom error reporting page that behaves exactly as I want, but I was trying to do this in a simpler way.

I'm not sure on this but try '<% flash.each do |name, msg| %> <%= content_tag :p, msg.html_safe, class: "flash #{name}" %> <% end %>' — Anezio Campos
– Anezio Campos, Commented Apr 23, 2015 at 16:38
@AnezioCampos, looks correct, but going a step further to make it an ordered list: <ol> <% flash.each do |name, msg| %> <%= content_tag :li, msg.html_safe, class: "flash #{name}" %> <% end %></ol> — Joe Essey
– Joe Essey, Commented Apr 23, 2015 at 16:41

agmcleod · Accepted Answer · 2015-04-23 18:33:50Z

1

Any reason you're using content tag right in the view when a regular tag works fine? Content tag is good for helper methods, so you can easily create html inside ruby code. Here's how i would do it in the view:

<% if flash.any? %>
<ol>
  <% flash.each do |name, msg| %>
    <li class="flash #{name}"><%= msg %></li>
  <% end %>
</ol>
<% end %>

answered Apr 23, 2015 at 18:33

agmcleod

13.6k13 gold badges61 silver badges100 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

J Edward Ellis Over a year ago

I'm not doing it that way because this code is in my layout and most flash messages are a single line.

Community · Accepted Answer · 2017-05-23 10:24:05Z

Anezio Campos suggests html_safe. After much research I chose to use sanitize with a white list of allowed tags instead. However, I still had a frustrating problem.

This code is being presented to the browser as HTML5. The problem appears in Chrome which is our projects only supported browser. I know that's a bad idea, but it's not my decision. Anyway if you look at the the W3 HTML Language Reference it says the ending paragraph tag is optional. Chrome placed my markup outside of the paragraph I was using to style the block!

So the final piece of the puzzle was to change from a paragraph tag to a div tag.

The result looks like:

<% flash.each do |name, msg| %>
      <% next if name.blank? || msg.blank? %>
    <div class="flash <%= name %>">
      <%= sanitize(msg, tags: %w(ol li)) %>
    </div>
<% end %>

Collectives™ on Stack Overflow

How to add HTML markup programmatically in a Ruby on Rails view?

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related