Passing data to partials in Ruby on Rails - Step-by-Step Execution

Concept Flow - Passing data to partials

Parent View

↓

Render Partial

↓

Pass Local Data

↓

Partial Receives Data

↓

Partial Renders Using Data

↓

Output Combined View

The parent view calls a partial and passes data as local variables. The partial receives and uses this data to render its content.

Execution Sample

Ruby on Rails

<%= render partial: 'user', locals: { user: @user } %>

<!-- _user.html.erb -->
<p>Name: <%= user.name %></p>

This code renders the '_user' partial and passes the @user object as a local variable named 'user'. The partial displays the user's name.

Execution Table

Step	Action	Data Passed	Partial Variable	Partial Output
1	Parent view calls render with partial 'user'	N/A	N/A	N/A
2	Pass locals: { user: @user }	@user object	user = @user	N/A
3	Partial '_user.html.erb' starts rendering	user = @user	user	N/A
4	Partial accesses user.name	user.name = 'Alice'	user	<p>Name: Alice</p>
5	Partial rendering completes	N/A	N/A	<p>Name: Alice</p>
6	Parent view includes partial output	N/A	N/A	Full view with <p>Name: Alice</p> included

💡 Partial rendering ends after outputting content using passed local data.

Variable Tracker

Variable	Start	After Step 2	After Step 4	Final
user	undefined	@user object	@user object with name 'Alice'	undefined after partial ends

Key Moments - 3 Insights

Why do we use 'locals' when rendering a partial?

To explicitly pass data as local variables to the partial. Instance variables like @user are available automatically, but 'locals' provides clarity, allows custom names, and passes non-instance data, as shown in execution_table step 2.

Can the partial access instance variables like @user directly without locals?

Yes, partials inherit instance variables (@user) automatically from the parent view and controller. Locals are used for explicit passing, local variables, or renaming, as shown in execution_table steps 2 and 3.

What happens if you forget to pass the required local variable?

The partial will raise an error because the variable is undefined when it tries to access it, as implied by the variable_tracker showing 'undefined' before locals are passed.

Visual Quiz - 3 Questions

Look at the execution table, what is the value of 'user' inside the partial at step 4?

A The @user object passed from the parent view

B Undefined

C Nil

D A new empty object

💡 Hint

Check the 'Partial Variable' and 'Data Passed' columns at step 4 in the execution_table.

At which step does the partial start rendering with the passed data?

A Step 1

B Step 2

C Step 3

D Step 5

💡 Hint

Look for when the partial '_user.html.erb' starts rendering in the execution_table.

If you omit 'locals: { user: @user }' when rendering, what will happen?

A Partial renders normally with access to @user

B Partial raises an error due to undefined 'user'

C Partial renders but 'user.name' is empty string

D Partial ignores the missing variable and renders nothing

💡 Hint

Refer to key_moments about variable availability and variable_tracker showing 'undefined' before locals are passed.

Concept Snapshot

Passing data to partials in Rails:
Use render partial: 'name', locals: { var: value }
Partial accesses data via local variable (e.g., 'var')
Partials DO inherit instance variables automatically
Pass data explicitly with locals for clarity
This keeps views modular and clear

Full Transcript

In Rails, when you want to reuse a view snippet called a partial, you often pass it data via locals. The parent view calls render with the partial name and passes data using the locals hash. This makes local variables available inside the partial. Instance variables like @user are accessible automatically, but locals provide explicitness. The partial uses these variables to render dynamic content. Without locals, local vars like 'user' are undefined and cause errors if used. This trace shows passing @user as 'user' to the partial, which renders the name. This keeps views clean and manageable.

Practice

1. What is the main purpose of using locals when rendering partials in Rails?

easy

A. To create a new controller action

B. To include JavaScript files in the partial

C. To define CSS styles for the partial

D. To pass data as local variables to the partial

Solution

1. Step 1: Understand partials in Rails

   Partials are reusable view templates that help keep code DRY (Don't Repeat Yourself).

2. Step 2: Role of locals

   The locals option lets you pass data as local variables to the partial, making it flexible and dynamic.

3. Final Answer:

   To pass data as local variables to the partial -> Option D

4. Quick Check:

   Passing data to partials = locals [OK]

Hint: Remember: locals pass data inside partials [OK]

Common Mistakes:

• Confusing locals with JavaScript or CSS inclusion
• Thinking partials create controller actions
• Assuming locals define styles

2. Which of the following is the correct syntax to pass a local variable named user with value @user to a partial called _profile.html.erb?

easy

A. <%= render partial: profile, user: @user %>

B. <%= render 'profile', locals: { user: @user } %>

C. <%= render profile, user: @user %>

D. <%= render partial: 'profile', locals: user: @user %>

Solution

1. Step 1: Identify correct render syntax with locals

   The correct way to pass locals is using locals: { key: value } inside the render call.

2. Step 2: Check each option

   <%= render 'profile', locals: { user: @user } %> uses locals: { user: @user } which is correct syntax. Others miss the locals hash or have wrong syntax.

3. Final Answer:

   <%= render 'profile', locals: { user: @user } %> -> Option B

4. Quick Check:

   Use locals hash to pass variables [OK]

Hint: Use locals: { var: value } to pass data [OK]

Common Mistakes:

• Omitting the locals keyword
• Passing variables directly without locals hash
• Incorrect hash syntax for locals

3. Given the following code in a Rails view:

user = User.new(name: 'Alice')
<%= render 'user_info', locals: { user: user } %>

And the partial _user_info.html.erb contains:

<p>Name: <%= user.name %></p>

What will be the rendered output?

medium

A. Name: Alice

B. Name:

C. Error: undefined local variable 'user'

D. Name: user

Solution

1. Step 1: Understand locals passing

   The variable user is passed as a local variable to the partial with value User.new(name: 'Alice').

2. Step 2: Partial uses user.name

   The partial accesses user.name, which is 'Alice', so it renders the name correctly.

3. Final Answer:

   <p>Name: Alice</p> -> Option A

4. Quick Check:

   Locals pass data correctly = Alice shown [OK]

Hint: Locals become variables inside partial [OK]

Common Mistakes:

• Forgetting to pass locals causes undefined variable error
• Assuming instance variables are automatically available
• Confusing variable names inside partial

4. Identify the error in this code snippet:

<%= render partial: 'comment', locals: { comment: @comment } %>

# In _comment.html.erb
<p><%= comment_text %></p>

What will happen when this view is rendered?

medium

A. Error: undefined local variable or method 'comment_text'

B. Renders the comment text correctly

C. Syntax error in render call

D. Renders nothing inside the paragraph

Solution

1. Step 1: Check locals passed to partial

   The locals hash passes comment: @comment, so inside the partial the variable comment is available.

2. Step 2: Check variable used in partial

   The partial uses comment_text, which is not defined or passed, causing an undefined variable error.

3. Final Answer:

   Error: undefined local variable or method 'comment_text' -> Option A

4. Quick Check:

   Variable name mismatch causes error [OK]

Hint: Variable names must match locals keys exactly [OK]

Common Mistakes:

• Using wrong variable name inside partial
• Assuming instance variables are available without passing
• Not passing required locals

5. You want to render a list of products using a partial _product.html.erb and pass each product as a local variable named item. Which code correctly renders the list with locals?

hard

A. <%= render product, collection: @products, as: :item %>

B. <%= render partial: 'product', collection: @products, locals: { item: product } %>

C. <%= render partial: 'product', collection: @products, as: :item %>

D. <% @products.each do |p| %>
<%= render 'product', locals: { item: product } %>
<% end %>

Solution

1. Step 1: Understand rendering collections with locals

   Rails allows rendering a collection with render partial: 'name', collection: array, as: :var to pass each element as a local variable.

2. Step 2: Check each option

   <%= render partial: 'product', collection: @products, as: :item %> correctly uses partial, collection, and as: :item to pass each product as item local variable. The <% @products.each do |p| %> <%= render 'product', locals: { item: product } %> <% end %> uses manual loop but product is undefined (loop var is p). The <%= render partial: 'product', collection: @products, locals: { item: product } %> has wrong locals usage (product undefined). The <%= render product, collection: @products, as: :item %> misses partial keyword and unquoted product undefined.

3. Final Answer:

   <%= render partial: 'product', collection: @products, as: :item %> -> Option C

4. Quick Check:

   Use collection + as for locals in partial [OK]

Hint: Use collection and as: :var for lists [OK]

Common Mistakes:

• Passing locals inside collection render incorrectly
• Forgetting to use as: to rename local variable
• Using manual loops instead of collection render