Railsで1対多の関係を設定するサンプル～画面表示

前回の記事で作成した Rteamクラスと Rmemberクラスの1対多の関係を画面から参照／更新できるようにしたい。

まずは、Rmemberクラスの Scaffoldで作成された画面から見てみる。

▽現状のindexページ

現状の indexページでは、Rteam のフィールドにインスタンスのハッシュ値が表示されているので、名前を表示するように変更する。

▽変更後のindex.html.erb

<h1>Listing rmembers</h1>

<table>
  <tr>
    <th>Name</th>
    <th>Rteam</th>
    <th></th>
    <th></th>
    <th></th>
  </tr>

<% @rmembers.each do |rmember| %>
  <tr>
    <td><%= rmember.name %></td>
    <td><%= rmember.rteam.name %></td>
    <td><%= link_to 'Show', rmember %></td>
    <td><%= link_to 'Edit', edit_rmember_path(rmember) %></td>
    <td><%= link_to 'Destroy', rmember, confirm: 'Are you sure?', method: :delete %></td>
  </tr>
<% end %>
</table>

▽変更後のindexページ

showページの方も同様にインスタンスのハッシュ値が表示されているので、名前を表示するように変更。

▽現状のshowページ

▽変更後のshow.html.erb

<p id="notice"><%= notice %></p>

<p>
  <b>Name:</b>
  <%= @rmember.name %>
</p>

<p>
  <b>Rteam:</b>
  <%= @rmember.rteam.name %>
</p>


<%= link_to 'Edit', edit_rmember_path(@rmember) %> |
<%= link_to 'Back', rmembers_path %>

▽変更後のshowページ

editページはテキストフィールドにインスタンスのハッシュ値が表示されていて何とも使いにくい。
どうやってインスタンスのハッシュ値を調べれば良いのか？

▽現状のeditページ

ハッシュ値の代わりに名前の一覧をコンボボックスで表示するように変更する。

▽現状のedit.html.erb

<h1>Editing rmember</h1>

<%= render 'form' %>

<%= link_to 'Show', @rmember %> |
<%= link_to 'Back', rmembers_path %>

edit.html.erb では、外部のファイルをレンダリングしているので、_form.html.erb の方を変更した。

▽変更後の_form.html.erb

<%= form_for(@rmember) do |f| %>
  <% if @rmember.errors.any? %>
    <div id="error_explanation">
      <h2><%= pluralize(@rmember.errors.count, "error") %> prohibited this rmember from being saved:</h2>

      <ul>
      <% @rmember.errors.full_messages.each do |msg| %>
        <li><%= msg %></li>
      <% end %>
      </ul>
    </div>
  <% end %>

  <div class="field">
    <%= f.label :name %><br />
    <%= f.text_field :name %>
  </div>
  <div class="field">
    <%= f.label :rteam %><br />
    <%= f.collection_select(:rteam_id, Rteam.find(:all), :id, :name) %>
  </div>
  <div class="actions">
    <%= f.submit %>
  </div>
<% end %>

▽変更後のeditページ

editの実行も問題なく修了した。

▽editの実行後

newページでもeditと同じファイルをレンダリングしているので、既にnewページの方でもコンボボックスが表示されるようになっている。

▽変更後のnewページ

次に、Rteamクラスの方は、下記のように showページで Rmemberの一覧を表示するように変更する。

現状のshowページ

▽変更後のshow.html.erb

<p id="notice"><%= notice %></p>

<p>
  <b>Name:</b>
  <%= @rteam.name %>
</p>

<p>
  <b>Member's name:</b><br />
  <% @rteam.rmembers.each do |rmember| %>
    <%= rmember.name %><br />
  <% end %>
</p>


<%= link_to 'Edit', edit_rteam_path(@rteam) %> |
<%= link_to 'Back', rteams_path %>

変更後のshowページ

editページと newページに関しては、ページ内でRmemberのリストを表示し、リストへの追加／変更／削除を実装する必要があって少々複雑なので、今回は見送りとした。