ドットインストールでRuby on Rails 3.2を学んだ際の詳細なメモ (31〜33)/全46

#主な内容 - Blogシステムを作る（続き）

[#31	記事を更新してみよう (1)](http://dotinstall.com/lessons/basic_rails/6531 "#31	記事を更新してみよう (1)")
[#32	記事を更新してみよう (2)](http://dotinstall.com/lessons/basic_rails/6532 "#32	記事を更新してみよう (2)")
[#33	記事を更新してみよう (3)](http://dotinstall.com/lessons/basic_rails/6533 "#33	記事を更新してみよう (3)")

Scaffoldを使わずに、一からブログアプリケーションを作成しよう（実践的）（続き）
>* コントローラーのメソッドと、それに対応するViewを作っていきましょう（続き）
>* Scaffoldでは自動生成してくれたModel、DBの設定、Controller、URL、Controllerのメソッド、Viewを自力で作ります。（続き - edit, update）

>記事のタイトル一覧を表示するindexメソッド、その記事を表示するshowメソッド、記事の新規作成フォームを作成するnewメソッド、記事を作成するcreateメソッドは完成したので次はその記事を編集するページが欲しいですね。ということでeditメソッド（記事編集フォーム）を作ります。また、フォームから送信されたデータを処理して記事を上書きするupdateメソッドも作成します。

#仕様（再確認）
1. Post（記事を投稿、編集、削除できる機能）
1. Comment（記事に対してコメントを投稿、削除できる機能）

#作成の流れ
1. blogプロジェクトを作成
1. Modelを作成
1. DB
1. Controllerの作成
1. URLの作成（ルーティングの設定）  ←ここまで終わっています
1. <b>Controllerのメソッドの作成  ←今はここです</b>
1. <b>メソッドに対応するViewを作成</b>

#6. 7. Controller内のMethod、それに対応するViewを作成（続き）
###作成するメソッド
>* index（完了）
>
>>app/views/posts/index.html.erb


>* create（完了）
>
>>Viewは無し（フォームに入力されたデータを処理するだけのメソッドなので、Viewは必要ありません。）

>* new（完了）
>
>>app/views/posts/new.html.erb

>* show（完了）
>
>>app/views/posts/show.html.erb

* edit
>app/views/posts/edit.html.erb

* update
>Viewは無し（編集画面からの送信を処理するだけのメソッドなので、Viewは必要ありません。）

* destroy
>Viewは無し（削除リンクをindex.html.erbにつけますが、destroy専用のViewは必要ありません。）

##edit
編集するオブジェクトをデータベースから取得するeditメソッドを作ります。
###editメソッドを作成
Postモデルのオブジェクトを生成します。生成したオブジェクトに対してViewのフォームに入力されたデータで操作を加えていくのはcreateの仕事です。

```ruby:app/controllers/posts_controller.rb
# coding: utf-8

class PostsController < ApplicationController


〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
　　　　　　　　　中略
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜

    # editメソッド
    def edit
        # 指定したオブジェクトの取得
        @post = Post.find(params[:id])
    end

end
```

###editメソッドに対応するView（edit.html.erb）を作成
取得したPostオブジェクト（@post）に対するフォームを生成します。

```bash:Terminal
$ touch app/views/posts/edit.html.erb
```
```erb:app/views/posts/edit.html.erb
<!--ヘッダー-->
<h1>New Post</h1>

<!--@postに対するフォームを生成-->
<%= form_for(@post) do |f| %>

	<!--titleに対するテキストフィールド-->
	<div class = "field">
		<!--titleというIDが付いたTitleという文字列ラベルを生成-->
		<%= f.label :title %>
		<!--titleというIDが付いたTitleというテキストフィールドを生成-->
		<%= f.text_field :title %>
	</div>

	<!--contentに対するテキストエリア（５行分）-->
	<div class = "field">
		<!--contentというIDが付いたContentという文字列ラベルを生成-->
		<%= f.label :content %>
		<!--ContentというIDが付いたContentという５行分のテキストエリアを生成-->
		<%= f.text_area :content, :rows => 5 %>
	</div>

	<!--送信ボタンを生成-->
	<div class = "actions">
		<!--contentというIDが付いたContentという文字列ラベルを生成-->
		<%= f.submit %>
	</div>

<% end %>

<!--HOME（index）へ戻るリンク-->
<%= link_to 'home', posts_path %>
```

####動作確認
http://localhost:3000/
![スクショ８.png](https://qiita-image-store.s3.amazonaws.com/0/27500/957c9d1c-c986-aab4-4476-87a1f51888e8.png "スクショ８.png")

Editをクリックします。

![スクリーンショット 2014-03-14 02.16.34.png](https://qiita-image-store.s3.amazonaws.com/0/27500/0ccad6bc-09e5-765b-3fd5-5d55813820bb.png "スクリーンショット 2014-03-14 02.16.34.png")

取得したPostオブジェクトに対するフォームが完成確認できました。データもきちんと取得できていますね。

###フォームを部品テンプレートにする
ここまでで気付くことがありますね。フォームに関するコードがnewと全く同じです。このようなものは使い回しができる部品テンプレートを使うと便利です。Railsの思想であるDon't Repeat Yourself　｢同じことを繰り返すな」というやつですね。
部品テンプレートも拡張子は`.html.erb`で、ファイル名の頭を`_`（アンダーバー）にします。

では、実際に部品テンプレートを作成してみます。

```bash:Terminal
$ touch app/views/posts/_form.html.erb
```
```erb:app/views/posts/_form.html.erb
<!--@postに対するフォーム-->
<%= form_for(@post) do |f| %>

    <!--もし@postにエラーがあったら-->
    <% if @post.errors.any? %>
        <!--順序無しリスト-->
        <ul>
            <!--エラーの数だけループ-->
            <% @post.errors.full_messages.each do |msg| %>
                <!--メッセージの内容を表示   -->
                <li><%= msg %></li>
            <% end %>
        </ul>
    <% end %>

    <!--titleに対するテキストフィールド-->
    <div class = "field">
        <!--titleに対するテキストフィールド-->
        <%= f.label :title %>
        <%= f.text_field :title %>
    </div>

    <!--contentに対するテキストエリア（５行分）-->
    <div class = "field">
        <%= f.label :content %>
        <%= f.text_area :content, :rows => 5 %>
    </div>

    <!--送信ボタン（createメソッドへ）-->
    <div class = "actions">
        <%= f.submit %>
    </div>

<% end %>
```

では、Editビュー、そしてNewビューにこの_formテンプレートを埋め込みます。

それぞれのテンプレートからフォームの部分を削除し、その部分に`<%= render 'form' %>`を追加します。

```erb:app/views/posts/edit.html.erb
<!--ヘッダー-->
<h1>Edit Post</h1>

<%= render 'form' %>

<!--HOME（index）へ戻るリンク-->
<%= link_to 'home', posts_path %>
```

```erb:app/views/posts/new.html.erb
<!--ヘッダー-->
<h1>New Post</h1>

<%= render 'form' %>

<!--HOME（index）へ戻るリンク-->
<%= link_to 'home', posts_path %>
```
####動作確認
http://localhost:3000/posts/1/edit
![スクリーンショット 2014-03-14 03.02.47.png](https://qiita-image-store.s3.amazonaws.com/0/27500/596a6d6d-a6bb-0719-7294-5cc50c17d045.png "スクリーンショット 2014-03-14 03.02.47.png")

http://localhost:3000/posts/new
![スクリーンショット 2014-03-14 03.02.59.png](https://qiita-image-store.s3.amazonaws.com/0/27500/aa76a14c-e085-f8ab-4b24-7f83cf8e3248.png "スクリーンショット 2014-03-14 03.02.59.png")

きちんと埋め込めていることが確認できました。ボタンの表示もきちんとページに対応していますね。

##update
editのViewから渡された@postのデータで元のデータを上書きするupdateメソッドを作成します。
###updateメソッド
editビューからHTTPリクエストで送信されたデータを元にデータベースを上書きします。

```ruby:app/controllers/posts_controller.rb
# coding: utf-8

class PostsController < ApplicationController


〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
　　　　　　　　　中略
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜

    # updateメソッド
    def update
        # Viewから渡されたデータを元にオブジェクトを生成
        @post = Post.find(params[:id])
        if @post.update_attributes(params[:post])
            # もしDBへの生成したオブジェクトの保存が成功したら/postsへリダイレクト（移動）    
            redirect_to posts_path
            flash[:notice] = '更新されました！'
        else
            # もしDBへの生成したオブジェクトの保存が成功しなかったら/posts/newへ戻ってnewビューを直させる 
            render action: 'edit'
        end
    end

end
```

###動作確認
![スクリーンショット 2014-03-14 16.56.02.png](https://qiita-image-store.s3.amazonaws.com/0/27500/a5d1eb89-09c2-522f-dc0a-5fdd8da37898.png "スクリーンショット 2014-03-14 16.56.02.png")

![スクリーンショット 2014-03-14 17.01.14.png](https://qiita-image-store.s3.amazonaws.com/0/27500/d9d8c635-2298-b6a5-f2f0-6b19a135401f.png "スクリーンショット 2014-03-14 17.01.14.png")

![スクリーンショット 2014-03-14 16.56.24.png](https://qiita-image-store.s3.amazonaws.com/0/27500/039612ec-9683-046f-302f-d0e3c0545e10.png "スクリーンショット 2014-03-14 16.56.24.png")

![スクリーンショット 2014-03-14 16.58.31.png](https://qiita-image-store.s3.amazonaws.com/0/27500/e770a6fc-9b13-9b03-6a1c-50e3b6ce4edf.png "スクリーンショット 2014-03-14 16.58.31.png")

OKですね。

#メモ一覧
1. [ドットインストールでRuby on Rails 3.2を学んだ際の詳細なメモ (1〜2)/全46](http://qiita.com/hirokishirai/items/34d26a40f99425333f79 "ドットインストールでRuby on Rails 3.2を学んだ際の詳細なメモ (1〜2)/全46")
>[#01	Ruby on Railsとは何か？](http://dotinstall.com/lessons/basic_rails/6501 "#01	Ruby on Railsとは何か？")
[#02	必要となるツールを揃えよう](http://dotinstall.com/lessons/basic_rails/6502 "#02	必要となるツールを揃えよう")
>
>* Ruby on Railsはこんなものですよ
>* 必要な情報はここら辺で集まりますよ
>* 必要な知識にはこんなものがありますよ
>* 開発環境はこんな感じですよ

1. [ドットインストールでRuby on Rails 3.2を学んだ際の詳細なメモ 3/全46](http://qiita.com/hirokishirai/items/e0d3a7aa1de02ca2dbfc "ドットインストールでRuby on Rails 3.2を学んだ際の詳細なメモ 3/全46")
>[#03	MVCとは何か？](http://dotinstall.com/lessons/basic_rails/6503 "#03	MVCとは何か？")
>
>* Ruby on RailsはMVCフレームワークですよ
>* MVCはこんなものですよ

1. [ドットインストールでRuby on Rails 3.2を学んだ際の詳細なメモ (4〜8)/全46](http://qiita.com/hirokishirai/items/0038bbe5cd35ca92d60f "ドットインストールでRuby on Rails 3.2を学んだ際の詳細なメモ (4〜8)/全46")
>[#04 はじめてのRailsプロジェクト](http://dotinstall.com/lessons/basic_rails/6504 "#04 はじめてのRailsプロジェクト")
[#05 ファイル構成をみていこう](http://dotinstall.com/lessons/basic_rails/6505 "#05 ファイル構成をみていこう")
アプリケーションを作成する基本的な流れを覚えましょう
>
>[#06 Webサーバーを立ち上げよう](http://dotinstall.com/lessons/basic_rails/6506 "#06 Webサーバーを立ち上げよう")
作成したWebアプリケーションをどうささせてみましょう
>
>[#07 scaffoldを使ってみよう (1)](http://dotinstall.com/lessons/basic_rails/6507 "#07 scaffoldを使ってみよう (1)")
[#08 scaffoldを使ってみよう (2)](http://dotinstall.com/lessons/basic_rails/6508 "#08 scaffoldを使ってみよう (2)")
DB、Model、View、Controllerの作成、URLの設定をしてみましょう

1. [ドットインストールでRuby on Rails 3.2を学んだ際の詳細なメモ (9〜13)/全46](http://qiita.com/hirokishirai/items/3c756d65fa837f765dc9 "ドットインストールでRuby on Rails 3.2を学んだ際の詳細なメモ (9〜13)/全46")
>[#09 ブログシステムを作ろう](http://dotinstall.com/lessons/basic_rails/6509 "#09 ブログシステムを作ろう")
[#10	新しいプロジェクトを作ろう](http://dotinstall.com/lessons/basic_rails/6510 "#10	新しいプロジェクトを作ろう")
[#11	Postモデルを作ろう](http://dotinstall.com/lessons/basic_rails/6511 "#11	Postモデルを作ろう")
[#12	Postsコントローラーを作ろう](http://dotinstall.com/lessons/basic_rails/6512 "#12	Postsコントローラーを作ろう")
[#13	ルーティングの設定をしよう](http://dotinstall.com/lessons/basic_rails/6513 "#13	ルーティングの設定をしよう")
Scaffoldを使わずに、一からブログアプリケーションを作成しよう（実践的）
プロジェクト、Model、Controllerを作成し、ルーティングの設定をしよう

1. [ドットインストールでRuby on Rails 3.2を学んだ際の詳細なメモ (14〜21)/全46](http://qiita.com/hirokishirai/items/9c9b02311a95fb6a2e5d "ドットインストールでRuby on Rails 3.2を学んだ際の詳細なメモ (14〜21)/全46")
>[#14	デバッグに使えるコンソールについて](http://dotinstall.com/lessons/basic_rails/6514 "#14	デバッグに使えるコンソールについて")
[#15	コントローラーのメソッドについて](http://dotinstall.com/lessons/basic_rails/6515 "#15	コントローラーのメソッドについて")
[#16	記事の一覧を表示する (1)](http://dotinstall.com/lessons/basic_rails/6516 "#16	記事の一覧を表示する (1)")
[#17	記事の一覧を表示する (2)](http://dotinstall.com/lessons/basic_rails/6517 "#17	記事の一覧を表示する (2)")
[#18	リンクを貼ってみよう](http://dotinstall.com/lessons/basic_rails/6518 "#18	リンクを貼ってみよう")
[#19	HTMLテンプレートを変更しよう](http://dotinstall.com/lessons/basic_rails/6519 "#19	HTMLテンプレートを変更しよう")
[#20	ロゴ画像を表示させてみよう](http://dotinstall.com/lessons/basic_rails/6520 "#20	ロゴ画像を表示させてみよう")
[#21	記事一覧画面をrootにしてみよう](http://dotinstall.com/lessons/basic_rails/6521 "#21	記事一覧画面をrootにしてみよう")
>
>Scaffoldを使わずに、一からブログアプリケーションを作成しよう（実践的）（続き）
`rails console`とか、`rails dbconsole`なんかの便利なツールがありますよ
コントローラーのメソッドと、それに対応するViewを作っていきましょう
>
>Scaffoldでは自動生成してくれたModel、DBの設定、Controller、URL、Controllerのメソッド、Viewを自力で作ります。（まずは１つ）

1. [ドットインストールでRuby on Rails 3.2を学んだ際の詳細なメモ (22〜23)/全46](http://qiita.com/hirokishirai/items/ba9bea6679ca1a1f8629 "ドットインストールでRuby on Rails 3.2を学んだ際の詳細なメモ (22〜23)/全46")
>[#22	記事の詳細を表示する (1)](http://dotinstall.com/lessons/basic_rails/6522 "#22	記事の詳細を表示する (1)")
[#23	記事の詳細を表示する (2)](http://dotinstall.com/lessons/basic_rails/6523 "#23	記事の詳細を表示する (2)")
>
>Scaffoldを使わずに、一からブログアプリケーションを作成しよう（実践的）（続き）
>
>* コントローラーのメソッドと、それに対応するViewを作っていきましょう（続き）
>* Scaffoldでは自動生成してくれたModel、DBの設定、Controller、URL、Controllerのメソッド、Viewを自力で作ります。（続き - show）

1. [ドットインストールでRuby on Rails 3.2を学んだ際の詳細なメモ (24〜30)/全46](http://qiita.com/hirokishirai/items/979a1ca68716698ec103 "ドットインストールでRuby on Rails 3.2を学んだ際の詳細なメモ (24〜30)/全46")
>
[#24 新しい記事を追加しよう (1)](http://dotinstall.com/lessons/basic_rails/6524 "#24 新しい記事を追加しよう (1)")
[#25	新しい記事を追加しよう (2)](http://dotinstall.com/lessons/basic_rails/6525 "#25	新しい記事を追加しよう (2)")
[#26	新しい記事を追加しよう (3)](http://dotinstall.com/lessons/basic_rails/6526 "#26	新しい記事を追加しよう (3)")
[#27	バリデーションを設定しよう](http://dotinstall.com/lessons/basic_rails/6527 "#27	バリデーションを設定しよう")
[#28	バリデーションエラーを表示しよう](http://dotinstall.com/lessons/basic_rails/6528 "#28	バリデーションエラーを表示しよう")
[#29	フラッシュメッセージを表示する](http://dotinstall.com/lessons/basic_rails/6529 "#29	フラッシュメッセージを表示する")
[#30	メッセージをjQueryで消す](http://dotinstall.com/lessons/basic_rails/6530 "#30	メッセージをjQueryで消す")
>
Scaffoldを使わずに、一からブログアプリケーションを作成しよう（実践的）（続き）
>
>* コントローラーのメソッドと、それに対応するViewを作っていきましょう（続き）
>* Scaffoldでは自動生成してくれたModel、DBの設定、Controller、URL、Controllerのメソッド、Viewを自力で作ります。（続き - new,create）
>
>記事のタイトル一覧を表示するindexメソッド、その記事を表示するshowメソッドは完成したので次はその記事を表示するページが欲しいですね。ということでnewメソッド（新規作成フォーム）を作ります。また、フォームから送信されたデータを処理して新しい記事を作成するcreateメソッドも作成します。
>
バリデーション（検査）の設定をやってみよう（実践的）

1. [ドットインストールでRuby on Rails 3.2を学んだ際の詳細なメモ (31〜33)/全46](http://qiita.com/hirokishirai/items/3c0552e258b2f7d5defc "ドットインストールでRuby on Rails 3.2を学んだ際の詳細なメモ (31〜33)/全46")
>
[#31	記事を更新してみよう (1)](http://dotinstall.com/lessons/basic_rails/6531 "#31	記事を更新してみよう (1)")
[#32	記事を更新してみよう (2)](http://dotinstall.com/lessons/basic_rails/6532 "#32	記事を更新してみよう (2)")
[#33	記事を更新してみよう (3)](http://dotinstall.com/lessons/basic_rails/6533 "#33	記事を更新してみよう (3)")
>Scaffoldを使わずに、一からブログアプリケーションを作成しよう（実践的）（続き）
>
>* コントローラーのメソッドと、それに対応するViewを作っていきましょう（続き）
>* Scaffoldでは自動生成してくれたModel、DBの設定、Controller、URL、Controllerのメソッド、Viewを自力で作ります。（続き - edit, update）
>
>記事のタイトル一覧を表示するindexメソッド、その記事を表示するshowメソッド、記事の新規作成フォームを作成するnewメソッド、記事を作成するcreateメソッドは完成したので次はその記事を編集するページが欲しいですね。ということでeditメソッド（記事編集フォーム）を作ります。また、フォームから送信されたデータを処理して記事を上書きするupdateメソッドも作成します。
1. [ドットインストールでRuby on Rails 3.2を学んだ際の詳細なメモ (34〜36)/全46](http://qiita.com/hirokishirai/items/cf4cc479b09d35501fc3 "ドットインストールでRuby on Rails 3.2を学んだ際の詳細なメモ (34〜36)/全46")
>
[#34	記事を削除してみよう](http://dotinstall.com/lessons/basic_rails/6534 "#34	記事を削除してみよう")
[#35	削除処理をAjax化しよう (1)](http://dotinstall.com/lessons/basic_rails/6535 "#35	削除処理をAjax化しよう (1)")
[#36	削除処理をAjax化しよう (2)](http://dotinstall.com/lessons/basic_rails/6536 "#36	削除処理をAjax化しよう (2)")
>Scaffoldを使わずに、一からブログアプリケーションを作成しよう（実践的）（続き）
>
>* コントローラーのメソッドと、それに対応するViewを作っていきましょう（続き）
>* Scaffoldでは自動生成してくれたModel、DBの設定、Controller、URL、Controllerのメソッド、Viewを自力で作ります。（続き - destroy）
>
>記事のタイトル一覧を表示するindex、その記事を表示するshow、記事の新規作成フォームを作成するnew、記事を作成するcreate、記事を編集するeditは完成したので次はその記事を削除するページが欲しいですね。ということでdestroyを作ります。

1. [ドットインストールでRuby on Rails 3.2を学んだ際の詳細なメモ (37〜46)/全46](http://qiita.com/hirokishirai/items/a25da39da0e6b32246ed "ドットインストールでRuby on Rails 3.2を学んだ際の詳細なメモ (37〜46)/全46")
>
[#37	Commentモデルを作ろう](http://dotinstall.com/lessons/basic_rails/6537 "#37	Commentモデルを作ろう")
[#38	Commentsコントローラーを作ろう](http://dotinstall.com/lessons/basic_rails/6538 "#38	Commentsコントローラーを作ろう")
[#39	コメントを表示させよう](http://dotinstall.com/lessons/basic_rails/6539 "#39	コメントを表示させよう")
[#40	コメントを投稿してみよう (1)](http://dotinstall.com/lessons/basic_rails/6540 "#40	コメントを投稿してみよう (1)")
[#41	コメントを投稿してみよう (2)](http://dotinstall.com/lessons/basic_rails/6541 "#41	コメントを投稿してみよう (2)")
[#42	バリデーションを設定しよう](http://dotinstall.com/lessons/basic_rails/6542 "#42	バリデーションを設定しよう")
[#43	コメントを削除してみよう (1)](http://dotinstall.com/lessons/basic_rails/6543 "#43	コメントを削除してみよう (1)")
[#44	コメントを削除してみよう (2)](http://dotinstall.com/lessons/basic_rails/6544 "#44	コメントを削除してみよう (2)")
[#45	コメント件数を表示してみよう](http://dotinstall.com/lessons/basic_rails/6545 "#45	コメント件数を表示してみよう")
[#46	Railsを日本語化しよう](http://dotinstall.com/lessons/basic_rails/6546 "#46	Railsを日本語化しよう")
>Scaffoldを使わずに、一からブログアプリケーションを作成しよう（実践的）（続き）
>
>* 新しい機能（Comment）を追加させましょう
>* Scaffoldでは自動生成してくれたModel、DBの設定、Controller、URL、Controllerのメソッド、Viewを自力で作ります。