Ruby-on-rails-rails-views

提供:Dev Guides
移動先:案内検索

Ruby on Rails-ビュー

Railsビューは、相互にアクセス可能な変数を通じてコン​​トローラーとデータを共有するERbプログラムです。

ライブラリアプリケーションのapp/viewsディレクトリを見ると、作成したコントローラーごとに1つのサブディレクトリが表示されます:book。 これらの各サブディレクトリは、同じ名前のコントローラーが生成スクリプトで作成されたときに自動的に作成されました。

Railsは、新しいメソッドごとにビューファイルを作成する必要があることを知らせます。 コントローラーで定義する各メソッドには、メソッドが収集しているデータを表示するために、メソッドと同じ名前の対応する erb ファイルが必要です。

それでは、book_controller.rbで定義したすべてのメソッドのビューファイルを作成しましょう。 これらのビューの実行中に、これらのアクションがデータベースに適用可能かどうかを同時に確認します。

listメソッドのビューファイルの作成

お好みのテキストエディターを使用して listl.erb というファイルを作成し、app/views/bookに保存します。 ファイルを作成して保存したら、Webブラウザーを更新します。 空白のページが表示されるはずです。そうでない場合は、ファイルのスペルをチェックし、コントローラーのメソッドとまったく同じであることを確認してください。

次に、実際のコンテンツを表示します。 以下のコードをlistl.erbに入れましょう。

<% if @books.blank? %>
<p>There are not any books currently in the system.</p>
<% else %>
<p>These are the current books in our system</p>

<ul id = "books">
   <% @books.each do |c| %>
   <li><%= link_to c.title, {:action => 'show', :id => c.id} -%></li>
   <% end %>
</ul>

<% end %>
<p><%= link_to "Add new Book", {:action => 'new' }%></p>

実行されるコードは、@ books配列にオブジェクトが含まれているかどうかを確認することです。 * .blank?*メソッドは、配列が空の場合はtrueを返し、オブジェクトが含まれている場合はfalseを返します。 この@booksオブジェクトは、listメソッド内のコントローラーで作成されました。

<%=%>タグ間のコードは link_to メソッド呼び出しです。 link_toの最初のパラメーターは、<a>タグの間に表示されるテキストです。 2番目のパラメーターは、リンクがクリックされたときに呼び出されるアクションです。 この場合、それはshowメソッドです。 最後のパラメーターは、paramsオブジェクトを介して渡されるブックのIDです。

今、ブラウザを更新してみてください。ライブラリに本がないので、次の画面が表示されます。

ブックメッセージなし

新しいメソッドのビューファイルの作成

今まで、図書館には本がありません。 システムにいくつかの本を作成する必要があります。 したがって、book_controller.rbで定義されている new メソッドに対応するビューを設計しましょう。

お気に入りのテキストエディターを使用してnewl.erbというファイルを作成し、app/views/bookに保存します。 次のコードをnewl.erbファイルに追加します。

<h1>Add new book</h1>

<%= form_tag :action => 'create' do %>
<p><label for = "book_title">Title</label>:

<%= text_field 'books', 'title' %></p>
<p><label for = "book_price">Price</label>:

<%= text_field 'books', 'price' %></p>
<p><label for = "book_subject_id">Subject</label>:

<%= collection_select(:books, :subject_id, @subjects, :id, :name, prompt: true) %></p>
<p><label for = "book_description">Description</label><br/>

<%= text_area 'books', 'description' %></p>
<%= submit_tag "Create" %>

<% end -%>
<%= link_to 'Back', {:action => 'list'} %>

ここで、 form_tag メソッドは、提供されたすべての情報を使用して、Rubyコードを通常のHTML <form>タグに解釈します。 このタグは、たとえば、次のHTMLを出力します-

<form action = "/book/create" method = "post">

次のメソッドは text_field で、<input>テキストフィールドを出力します。 text_fieldのパラメーターは、オブジェクトとフィールド名です。 この場合、オブジェクトは_book_で、名前は_title_です。

*collection_select* と呼ばれるRailsメソッドは、@ booksなどの配列から構築されたHTML選択メニューを作成します。 次のような5つのパラメータがあります-
  • *:book *-操作しているオブジェクト。 この場合、それは本オブジェクトです。
  • *:subject_id *-ブックの保存時に入力されるフィールド。
  • @ books -使用しているアレイ。
  • *:id *-データベースに保存されている値。 HTMLの観点では、これは<option>タグの値パラメーターです。
  • *:name *-プルダウンメニューにユーザーに表示される出力。 これは、<option>タグ間の値です。

次に使用されるのは submit_tag で、フォームを送信する<input>ボタンを出力します。 最後に、単に</form>に変換する end メソッドがあります。

ブラウザにアクセスして、* http://localhost:3000/book/new。*にアクセスします。これにより、次の画面が表示されます。

新しい本

このフォームにデータを入力し、[作成]ボタンをクリックします。 ここで私はフィールドに次の詳細を追加しました-

Title: Advance Physics
Price: 390
Subject: Physics
Description: This is test to create new book
*Create* ボタンをクリックすると、 *create* メソッドが呼び出されます。このメソッドは *list* または *new* メソッドを使用して結果を表示するため、ビューは不要です。 したがって、[作成]ボタンをクリックすると、データが正常に送信され、リストページにリダイレクトされます。ここで、次のように1つのアイテムがリストされます。

ブックの作成

リンクをクリックすると、まだshowメソッドのテンプレートファイルを作成していないため、別のテンプレートが見つからないというエラーが表示されます。

showメソッドのビューファイルの作成

このメソッドは、ライブラリで利用可能な本に関する完全な詳細を表示します。 app/views/bookの下にshowl.erbファイルを作成し、次のコードを入力します-

<h1><%= @book.title %></h1>

<p>
   <strong>Price: </strong> $<%= @book.price %><br/>
   <strong>Subject :</strong> <%= @book.subject.name %><br/>
   <strong>Created Date:</strong> <%= @book.created_at %><br/>
</p>

<p><%= @book.description %></p>

<hr/>

<%= link_to 'Back', {:action => 'list'} %>

関連付けを最大限に活用し、関連オブジェクトからデータを簡単にプルできるようにするのは初めてです。

使用される形式は*@variable.relatedObject.column*です。 この場合、 belongs_to アソシエーションを使用して、@ book変数を通じてサブジェクトの名前の値を取得できます。 リストされたレコードをクリックすると、次の画面が表示されます。

ショーブック

editメソッド用のビューファイルの作成

editl.erbという新しいファイルを作成し、app/views/bookに保存します。 次のコードでそれを埋めます-

<h1>Edit Book Detail</h1>

<%= form_for @book, :url =>{:action => "update", :id =>@book} do |f| %>

<p>Title: <%= f.text_field 'title' %></p>
<p>Price: <%= f.text_field  'price' %></p>
<p>Subject: <%= f.collection_select :subject_id, Subject.all, :id, :name %></p>
<p>Description<br/>

<%= f.text_area 'description' %></p>
<%= f.submit "Save changes" %>
<% end %>

<%= link_to 'Back', {:action => 'list' } %>

このコードは、idを作成および定義する代わりに更新するアクションを除いて、 new メソッドに非常に似ています。

このシナリオでは、フォームアクションに form_for タグを使用しました。 form_tag よりもパフォーマンスが向上します。 なぜそれはモデルとの相互作用を簡単に作成するからです。 そのため、モデルとフォームフィールド間の相互作用が必要な場合は、form_forタグを使用することをお勧めします。

この時点で、* listメソッドの*ビューファイルを変更する必要があります。 <li> </li>要素に移動し、次のように変更します-

<li>
   <%= link_to c.title, {:action => "show", :id => c.id} -%>
   <b> <%= link_to 'Edit', {:action => "edit",
   :id => c.id} %></b>
</li>

ここで、* http://localhost:3000/book/list。を使用して本を閲覧してみてください。 *Edit オプションとともにすべての本のリストが表示されます。 [編集]オプションをクリックすると、次の画面が表示されます-

ブックの編集

ここで、この情報を編集し、[変更を保存]ボタンをクリックします。 これにより、コントローラーファイルで使用可能な update メソッドが呼び出され、変更されたすべての属性が更新されます。 update メソッドは、 show または edit メソッドを使用して結果を表示するため、ビューファイルは必要ありません。

deleteメソッドのビューファイルの作成

Ruby on Railsを使用してデータベースから情報を削除するのはほとんど簡単です。 このメソッドは結果を表示するために list メソッドを使用しているため、deleteメソッドのビューコードを記述する必要はありません。 では、listl.erbをもう一度変更して、削除リンクを追加しましょう。

<li> </li>要素に移動し、次のように変更します-

<li>
   <%= link_to c.title, {:action => 'show', :id => c.id} -%>
   <b> <%= link_to 'Edit', {:action => 'edit', :id => c.id} %></b>
   <b> <%= link_to "Delete", {:action => 'delete', :id => c.id},
      :confirm => "Are you sure you want to delete this item?" %></b>
</li>
  • :confirm *パラメーターは、本当にアクションを実行するかどうかを尋ねるJavaScript確認ボックスを表示します。 ユーザーが[OK]をクリックすると、アクションが進行し、アイテムが削除されます。

今、* http://localhost:3000/book/list。を使用して書籍を閲覧してみてください。次のように、 *Edit および Delete オプションとともにすべての書籍のリストが表示されます-

ブックの削除

[削除]オプションを使用して、リストされたレコードを削除できます。

show_subjectsメソッドのビューファイルの作成

app/views/bookディレクトリに新しいファイルshow_subjectsl.erbを作成し、それに次のコードを追加します-

<h1><%= @subject.name -%></h1>

<ul>
   <% @subject.books.each do |c| %>
   <li><%= link_to c.title, :action => "show", :id => c.id -%></li>
   <% end %>
</ul>

単一の主題の多数の書籍リストを反復処理することにより、関連付けを利用しています。

ここで、showl.erbのSubject:行を変更して、件名リストにリンクが表示されるようにします。

<strong>Subject: </strong> <%= link_to @book.subject.name,
:action => "show_subjects", :id => @book.subject.id %><br/>

これにより、インデックスページに件名のリストが出力され、ユーザーはそれらに直接アクセスできます。

*listl.erb* を変更して、以下をファイルの先頭に追加します-
<ul id = "subjects">
   <% Subject.find(:all).each do |c| %>
   <li><%= link_to c.name, :action => "show_subjects", :id => c.id %></li>
   <% end %>
</ul>

次に、http://localhost:3000/book/listを使用して本を閲覧してみてください。 すべてのサブジェクトにリンクが表示されるため、そのサブジェクトに関連するすべての書籍を閲覧できます。

リスト対象

次は何ですか?

Railsのすべての操作に慣れていることを願っています。

次の章では、 Layouts を使用してデータをより良い方法で配置する方法について説明します。 RailsアプリケーションでCSSを使用する方法を示します。