Rails render partial with block

Question

I'm trying to re-use an html component that i've written that provides panel styling. Something like:

  <div class="v-panel">
    <div class="v-panel-tr"></div>
    <h3>Some Title</h3>
    <div class="v-panel-c">
      .. content goes here
    </div>
    <div class="v-panel-b"><div class="v-panel-br"></div><div class="v-panel-bl"></div></div>
  </div>

So I see that render takes a block. I figured then I could do something like this:

# /shared/_panel.html.erb
<div class="v-panel">
  <div class="v-panel-tr"></div>
  <h3><%= title %></h3>
  <div class="v-panel-c">
    <%= yield %>
  </div>
  <div class="v-panel-b"><div class="v-panel-br"></div><div class="v-panel-bl"></div></div>
</div>

And I want to do something like:

#some html view
<%= render :partial => '/shared/panel', :locals =>{:title => "Some Title"} do %>
  <p>Here is some content to be rendered inside the panel</p>
<% end %>

Unfortunately this doesn't work with this error:

ActionView::TemplateError (/Users/bradrobertson/Repos/VeloUltralite/source/trunk/app/views/sessions/new.html.erb:1: , unexpected tRPAREN

old_output_buffer = output_buffer;;@output_buffer = '';  __in_erb_template=true ; @output_buffer.concat(( render :partial => '/shared/panel', :locals => {:title => "Welcome"} do ).to_s)
on line #1 of app/views/sessions/new.html.erb:
1: <%= render :partial => '/shared/panel', :locals => {:title => "Welcome"} do -%>
...

So it doesn't like the = obviously with a block, but if I remove it, then it just doesn't output anything.

Does anyone know how to do what I'm trying to achieve here? I'd like to re-use this panel html in many places on my site.

The accepted answer is correct, but since Rails 5.0.0 this is possible without the `layout`-workaround, see http://guides.rubyonrails.org/layouts_and_rendering.html#using-partials-to-simplify-views — fabi, Aug 23 '17 at 07:19

score 239 · Accepted Answer · edited Mar 04 '15 at 12:14

239

While both of those answers above work (well the example that tony links to anyway) I ended up finding the most succinct answer in that above post (comment by Kornelis Sietsma)

I guess render :layout does exactly what I was looking for:

# Some View
<%= render :layout => '/shared/panel', :locals => {:title => 'some title'} do %>
  <p>Here is some content</p>
<% end %>

combined with:

# /shared/_panel.html.erb
<div class="v-panel">
  <div class="v-panel-tr"></div>
  <h3><%= title -%></h3>
  <div class="v-panel-c">
    <%= yield %>
  </div>
</div>

edited Mar 04 '15 at 12:14

Pez Cuckow

14,048
16
80
130

answered Jun 01 '10 at 17:58

brad

31,987
28
102
155

9

in Rails 3.2.2, I think you have to use `<%= %>` instead of `<% %>`, e.g. `<%= render :layout => '/shared/panel',` – Siwei Apr 15 '12 at 02:45
you're right, this post makes no assumptions about the Rails version, I'm sure people can figure that one out. – brad Apr 16 '12 at 18:09
like this one (solves my problem so +1), but is this good practice? won't there be some slowdown for some reason ? Maybe database triggers sooner than it suppose to because of another yield (don't have time to investigate that by-myself now, just wondering) – equivalent8 Jul 09 '12 at 14:43
If the outside panel is a `form` (variable name `f`), you should use `yield f` instead. – sequielo Oct 17 '13 at 19:54
1

Any way to know if a content has been yielded? In case of it's optional. – Vadorequest Jun 04 '14 at 08:12
This seems to mess up the context for `I18n.t` >:( – Jonathan Allard Jul 09 '15 at 18:10
Working with Rails `4.2.7` and got an error like `LocalJumpError` (no block given). Found out that when using `layout:` you have to name the hash for local parameters explicitly. e.g. `= render layout: 'mylaoyut', locals: {param1: 'Test'} do` – anka May 26 '17 at 09:39
9

In Rails 5.0 there was a [change](https://edgeguides.rubyonrails.org/5_0_release_notes.html#action-view-notable-changes) so this is general to all partials, not just layouts. You can change the first line of the calling code to: `<%= render '/shared/panel', title: 'some title' do %>` – Jay Mitchell Sep 26 '19 at 20:10

score 34 · Answer 2 · answered Dec 08 '14 at 21:12

Here's an alternative based on previous answers.

Create your partial on shared/_modal.html.erb:

<div class="ui modal form">
  <i class="close icon"></i>
  <div class="header">
    <%= heading %>
  </div>
  <div class="content">
    <%= capture(&block) %>
  </div>
  <div class="actions">
    <div class="ui negative button">Cancel</div>
    <div class="ui positive button">Ok</div>
  </div>
</div>

Define your method on application_helper.rb:

def modal_for(heading, &block)
  render(
    partial: 'shared/modal',
    locals: { heading: heading, block: block }
  )
end

Call it from any view:

<%= modal_for('My Title') do |t| %>
  <p>Here is some content to be rendered inside the partial</p>
<% end %>

score 13 · Answer 3 · answered Mar 19 '13 at 06:24

You can use the capture helper, and even inline in the render call :

<%= render 'my_partial',
           :locals => { :title => "Some Title" },
           :captured => capture { %>
    <p>Here is some content to be rendered inside the partial</p>
<% } %>

and in shared/panel:

<h3><%= title %></h3>
<div class="my-outer-wrapper">
  <%= captured %>
</div>

which will produce:

<h3>Some Title</h3>
<div class="my-outer-wrapper">
  <p>Here is some content to be rendered inside the partial</p>
</div>

See http://api.rubyonrails.org/classes/ActionView/Helpers/CaptureHelper.html

The inline pattern is nice for a partial needing multiple blocks. — mahemoff, Jun 22 '14 at 17:55

score 5 · Answer 4 · answered May 22 '17 at 11:18

Based on the accepted answer this is what worked well for me using Rails 4.

We can render a panel as such:

= render_panel('Non Compliance Reports', type: 'primary') do
  %p your content goes here!

This requires a helper method and a shared view:

helper method (ui_helper.rb)

def render_panel(heading, options = {}, &block)
  options.reverse_merge!(type: 'default')
  options[:panel_classes] = ["panel-#{options[:type]}"]

  render layout: '/ui/panel', locals: { heading: heading, options: options } do
    capture(&block)
  end
end

View (/ui/panel.html.haml)

.panel{ class: options[:panel_classes] }
  .panel-heading= heading
  .panel-body
    = yield

This works in Rails 5.x too, I just needed to change `panel.html.haml` to `_panel.html.haml` — Kris, Mar 13 '18 at 10:10

score 1 · Answer 5 · answered Jun 01 '10 at 15:51

I think it will work (just did quick dirty test) if you assign it to a variable first and then output it.

<% foo = render :partial => '/shared/panel', :locals =>{:title => "Some Title"} do %>
<p>Here is some content to be rendered inside the panel</p>
<% end %>
<%= foo %>

Rails render partial with block

5 Answers5

Linked