Ruby on Rails Views - Ruby on Rails

What is Rails View is?

A Rails View is an ERb program that shares data with controllers through mutually accessible variables.

Did you notice that the app/views directory of the library application has one subdirectory for each of the controllers, we have created: book. Each of these subdirectories was created automatically when the same-named controller was created with the generate script.

Rails let's you know that you need to create the view file for each new method. Each method you define in the controller needs to have a corresponding erb file, with the same name as the method, to display the data that the method is collecting.

So let's create view files for all the methods we have defined in the book_controller.rb. While executing these views, simultaneously check these actions are applicable into the database or not.

How to create view file for list method

Create a file called list.html.erb using your favourite text editor and save it to app/views/book. Then, refresh your web browser. Do you see a blank page? Perfect. If not, double check the spelling of your file and make sure that it is exactly the same as your controller's method.

Let us display the actual content now by put the following code into list.html.erb.

The code to be executed is to check whether the @books array has any objects in it. If the array is empty, the .blank? method returns true, and false if it contains any objects. This @books object was created in controller inside the list method.

The code between the <%= %> tags is a link_to method call. The first parameter of link_to is the text to be displayed between the <a> tags. The second parameter is what action is called when the link is clicked. In this case, it is the show method. The final parameter is the id of the book that is passed via the params object.

At this point, try refreshing your browser to see if you get the following screen as we don't have any book in our library.

No book message

How to create View File for new Method

Now let us create few books in the system. We have to design a view corresponding to the new method defined in the book_controller.rb.

Create a file called new.html.erb using your favorite text editor and save it to app/views/book. Add the following code to the new.html.erb file.

Here form_tag method interprets the Ruby code into a regular HTML <form> tag using all the information supplied to it. This tag, for example, outputs the following HTML −

Next method is text_field that outputs an <input> text field. The parameters for text_field are object and field name. In this case, the object is book and the name is title.

Rails method called collection_select, creates an HTML select menu built from an array, such as the @books one. There are five parameters, which are as follows −

  • :book − The object you are manipulating. In this case, it's a book object.

  • :subject_id − The field that is populated when the book is saved.

  • @books − The array you are working with.

  • :id − The value that is stored in the database. In terms of HTML, this is the <option> tag's value parameter.

  • :name − The output that the user sees in the pull-down menu. This is the value between the <option> tags.

The next used is submit_tag, which outputs an <input> button that submits the form. Finally, there is the end method that simply translates into </form>.

Type http://localhost:3000/book/new in your browser to get the following screen.

new book

Enter some data in this form and then click the Create button. For example,

When you click the Create button, it will call the create method, which does not need any view because this method is using either list or new methods to view the results. So, when you click the Create button, the data should submit successfully and redirect you to the list page, in which you now have a single item listed as follows −

Create book

When you click the link, you will see another Template is missing error, since you haven't created the template file for show method yet.

How to create View File for show Method

We have already seen that this method will display the complete detail about any book available in the library. Create a show.html.erb file under app/views/book and populate it with the following code −

This is the first time you have taken the full advantage of associations, which enable you to easily pull data from related objects.

The format used is @variable.relatedObject.column. In this instance, you can pull the subject's name value through the @book variable using the belongs_to associations. If click on any listed record then it will show you the following screen.

Show book

How to create View File for edit Method

Create a new file called edit.html.erb and save it in app/views/book. Populate it with the following code −

This code is very similar to the new method except action to be updated instead of creating and defining an id.

In this scenario, we used form_for tag for the form action. It will perform better than form_tag as it will create interaction with the Model easily. Therefore it is better to use form_for tag whenever you need interaction between the model and the form fields.

Now, we need some modification in the list method's view file. Go to the <li></li> element and modify it to look like the following −

At this point, http://localhost:3000/book/list will give you the listing of all the books along with Edit option. When you click the Edit option, then you will have next screen as follows −

Edit book

As you can see, you can edit this information and then click the Save Changes button. This will result in a call to update method available in the controller file and it will update all the changed attribute. Notice that the update method does not need any view file because it's using either show or edit methods to show its results.

How to create View File for delete Method

It is very easy to remove information from a database using Ruby on Rails as you do not need to write any view code for the delete method. This is because this method is using list method to display the result. So, let's just modify list.html.erb again and add a delete link.

Go to the <li></li> element and modify it to look like the following −

All rights reserved © 2018 Wisdom IT Services India Pvt. Ltd Protection Status

Ruby on Rails Topics