Ruby-on-rails-2.1-rails-views

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

Ruby on Rails 2.1-ビュー

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

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

今、あなたのWebサーバーが稼働していると仮定して、ブラウザのアドレスボックスに次の入力を提供します-

http://localhost:3000/book/list

コントローラで定義されたメソッドのビューファイルを定義していないため、次のエラーメッセージが表示されます。

テンプレートがありません

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

したがって、book_controller.rbで定義したすべてのメソッドのビューファイルを作成しましょう。

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

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

ここで、実際のコンテンツを表示するために、次のコードをlist.rhtmlに入れましょう。

<% 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 メソッドに対応するビューを設計しましょう。

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

<h1>Add new book</h1>

<% form_tag :action => 'create'  do %>

<p><label for="book_title">Title
</label>:

<%= text_field 'book', 'title' %></p>

<p><label for="book_price">Price</label>:

<%= text_field 'book', 'price' %></p>

<p><label for="book_subject">Subject</label>:

<%= collection_select(:book,:subject_id,@subjects,:id,:name) %></p>

<p><label for="book_description">Description</label><br/>

<%= text_area 'book', 'description' %></p>

<%= submit_tag "Create" %>

<% end  %>

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

ここで、* start_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_form_tag メソッドがあります。

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

新しい本

このフォームにデータを入力し、[作成]ボタンをクリックします。 これにより、 create メソッドが呼び出されますが、このメソッドは list または new メソッドを使用して結果を表示するため、ビューは必要ありません。 _Create_ボタンをクリックすると、データが正常に送信され、リストページにリダイレクトされます。ここで、次のように単一のアイテムがリストされます-

ブックの作成

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

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

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

<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メソッド用のビューファイルの作成

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

<h1>Edit Book Detail</h1>

<%= start_form_tag :action => 'update', :id => @book do %>

<p><label for="book_title">Title</label>:

   <%= text_field 'book', 'title' %></p>

<p><label for="book_price">Price</label>:

   <%= text_field 'book', 'price' %></p>

<p><label for="book_subject">Subject</label>:

   <%= collection_select(:book, :subject_id,
   @subjects, :id, :name) %></p>

<p><label for="book_description">Description</label><br/>

   <%= text_area 'book', 'description' %></p>

<%= submit_tag "Save changes" %>

<% end %>

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

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

この時点で、* 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を使用して本を閲覧してみてください。 *編集*オプションとともに、すべての書籍のリストが表示されます。 あなたが編集オプションをクリックすると、次のような画面が表示されます-

ブックの編集

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

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

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

<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を使用して本を閲覧してみてください。 それはあなたに次のように*編集*と*削除*オプションとともにすべての本のリストを提供します-

本の削除

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

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

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

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

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

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

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

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

*list.rhtml* を変更して、ファイルの先頭に以下を追加します-
<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を使用する方法も示します。