学生向けプログラミング入門

学生向けにプログラミングを解説。Java、C++、Ruby、PHP、データベース

Ruby on RailsでWebアプリケーション開発その12 表示(show)と編集(edit)の修正

<<前  [TOP]  次>>


まずは表示フォームの編集をしていきます。
デフォルトの見た目はこんな感じです。


f:id:MrRadiology:20180202103945p:plain


「app」フォルダから「views」「goods」と進んだフォルダにある「show.html.erb」ファイルのを以下のように編集します。


【app/views/goods/show.html.erb】

<h1>商品内容の表示</h1>
<br>
<p id="notice"><%= notice %></p>
<span>  </span><img height="100" style="border:ridge 5px #c0c0c0" src="<%= @good.image_url %>"/>
<br>
<br>
<p>
<font size="4px">
  <strong>【商品ID:】 </strong>
  <%= @good.goods_id %>
</font>
</p>

<p>
<font size="4px">
  <strong>【商品名:】 </strong>
  <%= @good.title %>
</font>
</p>

<p>
<font size="4px">
  <strong>【説明:】 </strong>
  <%= @good.description %>
</font>
</p>

<p>
<font size="4px">
  <strong>【画像URL:】 </strong>
  <%= @good.image_url %>
</font>
</p>

<p>
<font size="4px">
  <strong>【価格:】 </strong>
  <%= @good.price %><span></span>
</font>
</p>

<p>
<font size="4px">
  <strong>【登録日:】 </strong>
  <%=h ((@good.date).to_date).strftime('%Y年%m月%d日') %>
</font>
</p>

<p>
<font size="4px">
  <strong>【メーカー:】 </strong>
  <%= @good.maker %>
</font>
</p>

<p>
<font size="4px">
  <strong>【カテゴリー:】 </strong>
  <%= @good.category %>
</font>
</p>
<br>
<span>  </span><%= link_to '編集', edit_good_path(@good), class: 'btn' %> <span> </span>
<%= link_to '戻る', goods_path, class: 'btn' %>



「@good」は「goods_controller.rb」のshowメソッドで宣言されています。
これで、表示フォームの見栄えも良くなりました。


f:id:MrRadiology:20180202114244p:plain


次に編集(edit)フォームを修正していきます。
「views」の「goods」フォルダにある「edit.html.erb」ファイルのを以下のように編集します。


【app/views/goods/edit.html.erb】

<h1>商品の編集</h1>

<%= render 'form', good: @good %>
<br>
<%= link_to '表示', @good , class: 'btn'%><span> </span>
<%= link_to '戻る', goods_path , class: 'btn' %>



これで編集フォームの見た目も変わりました。


f:id:MrRadiology:20180202120308p:plain


<<前  [TOP]  次>>