Advanced ERB Tips
Walk through advanced techniques for working with ERB and Haml to configure how views are used in a Rails application.
Guide Tasks
  • Read Tutorial
  • Watch Guide Video
Video locked
This video is viewable to users with a Bottega Bootcamp license

We've spoken quite a bit about Embedded Ruby, but I still like to have a separate lesson to clarify it better.

There are two popular ways to embed Ruby in your code - ERB and Haml. The method we are using now is ERB. Haml is another method that allows you to use more Ruby, but it can be challenging for beginners and this is why I'm not using it in this course.

We've already seen ERB in our _projects.html.erb file, where we embedded a variable inside a Ruby code. Similarly, you can put any calculation, logic or anything else that needs to be executed inside a Ruby code. For example, you can say <%= 4 + 4 %> inside the About Us page. When you go to this page, you can see the value 8 printed on it.

Next, let's go to the _projects.html.erb file and do something that I usually do for debugging purposes. I'm going to start by commenting out the code, and for this, I add a "#" sign between my % and = signs.

So, my code will look like this:

<%#= project.title %>

If we now go to the Home Page, you'll see that it does not display anything except a - that is outside the code.

small

This kind of debugging is often used to identify the value of a variable, especially if it prints the wrong value.

You can even run through the entire database to see what values are stored in it. To do this, use the code:

<%= project.inspect %>

large

This code will print out everything contained in the variable project during every iteration. When you see the values contained in the database, it can be that much easier for you to debug.

If you refresh the home page now, you will see the entire object printed out for you.

large

To show you more ERB, I'm going to add our percent_complete variable to the About page.

<%= project.percent_complete %>

This is how the file will look like:

large

If you execute this code, your home page will look like this.

small

The percent_complete column has no values, so it looks blank. Now, if you want to add some code asking the application to display only when there is value in the percent_complete variable, you should add the following code:

<%= "| #{project.percent_complete}" if project.percent_complete != nil %>

Before that, I'm going to the projects page to add at least one value to the percent_complete variable.

large

This code simply tells the application to print the string interpolator present inside "" only if it meets the subsequent condition. Now, when you refresh the home page, you'll see:

small

You can also play around with the condition. For example, you can say unless !project.percent_complete for the same results and unless project.percent_complete for the opposite result.

You can also say if project.percent_complete and it will print the same values. You don't even need to add the code !=. However, if the value of percent_complete is 0.0, then it will also print that for you.

So, this is how you can run Ruby scripts inside your erb files.

An important caveat, you want to limit the amount of logic code placed in your views, all program logic should be in your controllers and models, however it's important to know how to integrate scripts into the views for debugging and learning what data you have available to your views.