Passing data to partials in Ruby on Rails - Mini Project: Build & Apply

Passing Data to Partials in Rails

📖 Scenario: You are building a simple Rails app that shows a list of books. Each book has a title and an author. You want to display each book using a reusable partial view.

🎯 Goal: Create a Rails partial to display a book's title and author. Pass each book's data from the main view to the partial using local variables.

📋 What You'll Learn

Create a list of books as an array of hashes in the view

Create a variable to hold the total number of books

Use a for loop with variables book to iterate over the books array

Render a partial called _book.html.erb passing the current book as a local variable

In the partial, display the book's title and author using the passed local variable

💡 Why This Matters

🌍 Real World

Passing data to partials is common in Rails apps to reuse view code and keep templates clean and organized.

💼 Career

Understanding how to pass data to partials is essential for Rails developers to build maintainable and scalable web applications.

1

Create the books data array

Create a variable called books that is an array of hashes with these exact entries: { title: 'The Hobbit', author: 'J.R.R. Tolkien' }, { title: '1984', author: 'George Orwell' }, and { title: 'Pride and Prejudice', author: 'Jane Austen' }.

Ruby on Rails

# Create the books array with the specified hashes
# Your code here

Hint

Use square brackets [] to create an array and curly braces {} for each book hash.

2

Create a variable for total books count

Create a variable called total_books and set it to the length of the books array using books.length.

Ruby on Rails

books = [
  { title: 'The Hobbit', author: 'J.R.R. Tolkien' },
  { title: '1984', author: 'George Orwell' },
  { title: 'Pride and Prejudice', author: 'Jane Austen' }
]
# Create total_books variable with the length of books
# Your code here

Hint

Use the .length method on the array to get the count.

3

Render the partial for each book with local variable

Use a for loop with variable book to iterate over books. Inside the loop, render the partial 'book' passing the current book as a local variable named book using render partial: 'book', locals: { book: book }.

Ruby on Rails

books = [
  { title: 'The Hobbit', author: 'J.R.R. Tolkien' },
  { title: '1984', author: 'George Orwell' },
  { title: 'Pride and Prejudice', author: 'Jane Austen' }
]
total_books = books.length

# Use a for loop to render the 'book' partial for each book with locals
# Your code here

Hint

Use the for loop syntax and the render method with partial and locals options.

4

Create the partial to display book details

In the partial file _book.html.erb, use the local variable book to display the book's title inside an <h3> tag and the author inside a <p> tag. Use <%= book[:title] %> and <%= book[:author] %> respectively.

Ruby on Rails

Hint

Use ERB tags <%= %> to output the book's title and author from the local variable.

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