Conditionals on View Page Integration Guide
Learn how to integrate conditionals into ERB view templates in a Ruby on Rails application.
Guide Tasks
  • Read Tutorial
  • Watch Guide Video
Video locked
This video is viewable to users with a Bottega Bootcamp license

Now that we have everything set up on the show page of projects, let's now get down to creating show pages for the tasks.

To start, let's go to tasks/show.html.erb. From the model and controller files, we have access to that particular project and task value, so there is nothing much to update on that side.

Before going into the code, I just want to tell that you that it's good programming practice to test your code as you build them. I've seen developers who tend to put in a lot of code without testing them, so it becomes hard to identify a bug when the functionality is not happening the way you want. This is why I prefer to do small incremental code and test them as I complete.

Coming back to this task, let's start with the code.

<hr>
<%= @task.title %>

Start the server with the command rails s, go to the browser and open the project that has tasks. In the projects show page, you can see the tasks listed out, and click any one. When you do that, you will have the title displayed in the tasks show page.

medium

You can work around the formatting to display content the way you want. You can also display all the values you want from the schema file like description, created time, updated time and completed.

Also, you may want to have a link back to the projects page in case you want to view a different task, and for this we are going to create a link with the following code:

<%= link_to "Back to Project", project_path(@task.project_id)  %>

Now, if you notice, we haven't really used the created_at and updated_at fields, so we can try to use them in this file.

Let's put a small condition to see if the created and updated times are the same, and if so, let's display only the created time. In general, the created and updated time will be the same if the user has not updated the file at any time. So, it makes no sense to display both the updated and created time, and can even be confusing to the user. This is why we have a small condition in place that checks if both the time are same, and if not, we want the page to display the updated time. The code for this is:

<h4>Task started: <%= @task.created_at %></h4>
<% if task.created_at != task.updated_at %>
  <h4>Updated: <%= task.updated_at %></h4>
<% end %>

Next, you can display appropriate message depending on whether a task is completed or not. This can also be in the form of a condition, where we can say:

<% if @task.completed == true %>
  <p><em>Task is completed</em></p>
<% else %>
  <p><em >Task is pending</em></p>
<% end %>

Lastly, let's puts an attachment link and will integrate the uploading later. To do this, type the code:

<p><%= link_to "Attachment",  @task.task_file.to_s %></p>

You can see all of it in the image below.

large

To see how it looks on your browser, hit the refresh button and you should see it.

medium

Everything is working fine, and of course, our attachment will not go anywhere because we haven't integrated our file uploader yet.

Now, I want to add another conditional logic to display the "attachment" link only when the task has a file that needs to be uploaded. To do this,

<%  unless @task.task_file.blank? %>
  <p><%= link_to "Attachment", @task.task_file.to_s %></p>
<% end %>

If you check on your browser, you can see that everything is working fine. However, with the existing functionality, we are not able to check the value of updated_at. So, let's add a link that allows us to edit the task. To know the path, you can go to the console and type:

rake routes | grep task

and this will bring up all routes associated with the works tasks.

large

From the above list, you know the path is edit_project_task and it needs a project id and a task id. Accordingly, write the code to have these parameters.

<%= link_to "Edit", edit_project_task_path(@task.project_id, @task.id) %>

The updated show file looks like this:

large

If you refresh the browser, you can see the link to edit. Click on this link and update a value. Now, if you go back to the task, you can find both the created and updated times.

medium

If you see, the timestamp gives the complete date and time, but we can customize it using built-in Ruby methods to get just the information we want.

With this, our tasks show page is complete.