フォームの作成

フォームの作成

本チャプターではRailsを使ってのフォームの作成方法を学びます。 Railsを使えばフォームの作成も簡単に行うことができます。

吉田先生

フォーム機能について学びます。フォーム機能は色々な場面で使用できますのでよく覚えておきましょう。

• 新規記事投稿フォームの作成
• フォームの送信

最終的に作成したいnewsableアプリではクリップした記事に対する意見を投稿できる投稿フォームが必要です。

本チャプターではRailsでのフォームの作成方法を理解することを目的としています。

新規記事投稿フォームの作成

前チャプターで作成したnew.html.erbファイルを開いてください。

今はまだ何の記述もなく、ブラウザにも何も表示されません。

ここに、blogの新規記事を投稿できるフォームを作成します。

フォームとは入力内容を送信できる画面のことです。

このようなお問合せのページなどで使用されている画面がフォームです。

フォームの作成には

<%= form_with scope: :article, url: articles_path, local: true do |form| %>

というヘルパーメソッドを使用します。

ヘルパーメソッドとは「リンクを貼る」「フォームを作る」など、単純に文字や画像を表示するといような処理ではなく何らかの操作をコードで実行する際に使うものです。

「この操作をするときは、このメソッドを使ってね」とRailsで用意されているデータの塊です。

数学でいう公式のようなものと考えるとわかりやすいかもしれません。

今回は新しく記事を作成する為のフォームをつくります。

new.html.erbファイルに以下のコードを入力して保存してください。

<%= form.label :title %>
    <%= form.text_field :title %><br>
    <%= form.label :text %><br>
    <%= form.text_area :text %><br>
    <%= form.submit %>
<% end %> 

保存したら、ブラウザを更新してください。

新しい記事の投稿用のフォームができているのがわかります。

フォームの送信

本チャプターではフォームの送信について学びます。

TitleやText欄に入力した内容を送信するとどのような流れでデータが処理されるのかを理解することで、ユーザーからのリクエストとコントローラの関係や、アクションについても理解することを目的としています。

フォームに入力して送信してみよう

ではtitleとtextにそれぞれ入力して　save Article　ボタンを押してみましょう。

するとUnknown actionというエラー画面になります。

save Articleボタンを押したときのリクエスト内容からroutesがコントローラの中身を確認したところ 'create'というアクションがないよ！というエラーがかえってきています。

ではarticlesコントローラにcreateアクションを追加しましょう。

createアクションを追加したら、ファイルを保存します。

先ほどブラウザでエラーがでていた画面を更新します。

この状態から何の変化もありませんが、大丈夫です。

Railsのアクションは、レスポンス（アクションに対しての結果）の種類を指定しないと204 No Contentをデフォルトで返します。

204 No Contentとはユーザーに返すべき処理は何もありませんよ、という指示です。

ここではcreateアクションを追加しただけで、レスポンスについては何も指定していないので、Railsは他に実行すべき処理はないと判断し同じ画面が表示されているということです。

送信された後のフォームの流れ

しかしこの図でもわかるように、createアクションは実行されています。アクション（メソッド）とはデータの塊でしたね。

articlesコントローラの中身は以下のようになっています。

class ArticlesController > ApplicationController
    def new

    end


    def create

    end
end

class ArticlesControllerというクラスの中に、newとcreateという２つのアクションが含まれています。

クラスの中のアクションは上から順に実行されるというルールがある為、newアクションの次はcreateアクションが実行されることになります。

create（作成する）というアクション（メソッド）が実行されたのであればcreateされたデータはどこにいってしまったのでしょうか。

フォームを送信すると、フォームの内容は パラメータ と呼ばれるデータとなってRailsに送信されます。

Railsに送られたパラメータは、受け取ったコントローラ（articlesコントローラ）内のアクション（createアクション）で確認することができます。

では、実際のパラメータがどのようになっているかを確認するために、createアクションに以下を追記しましょう。

def create

    raise params.inspect 

end
 

このraise params.inspect はパラメータの内容をエラーを発生させて表示させなさいという指示です。

ではブラウザの画面を戻して改めてTitleとTextを入力し送信してください。

すると次のようなエラー画面が表示されます。

"title"=>"記事投稿", "text"=>"記事投稿フォーム"、"action"=>"create"

とあるように、確かにパラメータ（データ）はcreateアクションへ送信されていることがわかります。