今日の教科書
##ページ作成を発展させる
###リダイレクトとパラメータ送付
リダイレクト:別のアクションへの処理の転送
redirect_to action: :アクション名 , params:[ハッシュ]
:
action:
リダイレクト先のアクションを指定するオプション
他のコントローラのアクションに帰る際はcontroller: コントローラ名
params:
で必要なパラメータを渡すことができる。
リダイレクトで新しいアクションを作ったら、ルーティングを忘れない。
###フォームの送信
####フォーム用にHTMLテンプレートを編集する。主に入力フィールドと送信ボタンを作る。
…… 入力・送信フォームを作る
1<form method="POST" action="送信先">
2 <input type="text" class="form-control"
3 name="input1" value="<%= @value %>">
4 <input type="submit" class="btn btn-primary">
5</form>
1で送信先に本文を送信する。2で入力のテキストボックスを作る。
3のnameでフォームの名前を作る。値をインスタンスに格納。。
4で送信ボタンを作成。
form-controlとbtn btn-primaryはBootstrapのクラス。フォームをデザインしてくれる。
####コントローラを修正する
フォームをそのまま対象のアクションにPOSTで送信している。
普通にそのアクションにアクセスした場合はGET。GETかPOSTかで処理を変える仕組みが必要。
if request.post? then
:requestはブラウザからサーバーに送られた情報をまとめたオブジェクト。post?はポスト送信をしたか否かを判別するメソッド。つまりif文でPOSTか否かで処理を分けられる。
####ルーティングの追加設定
POSTによるアクセスを許可する。
post
コントローラ名, to:
コントローラ#アクション `post `コントローラ/アクション
####InvalidAuthenticityTokenエラーとCSRF対策
railsのフォーム送信のセキュリティに引っかかる。
クラス下にprotect_from_forgery
で通過。
###フォームの送信2「フォームヘルパーを使おう」
ヘルパー:ビューで利用できるrailsの機能の一つ。
フォームヘルパーだとフォーム関係のタグを生成してくれる。
####フォームヘルパーをHTMLテンプレートに記述&CSRF対策の削除
<%= form_tag(controller: "コントローラ名", action: "アクション") do %>
:
フォームの
<%= text_field_tag("input1") %>
:テキストで入力フィールドのタグを作成する<%=submit_tag("Click") %>
:フォームを送信するボタンを生成する。引数はボタンに表示するテキスト。<% end %>
:中に=を入れないタグで終わる。
####フォームヘルパーで属性の指定
<%= text_field_tag( id , デフォルト値 , 属性の設定)%>
:属性を指定する基本の形。
<%= form_tag(controller: "hello", action: "index") do %>
<%= text_field_tag("input1","", {class:"form-control"}) %>
<%= submit_tag("Click", {class:"btn-primary"}) %>
<% end %>
###様々なフォームヘルパーメソッド
####チェックボックス
<%= check_box_tag("check1") %>
<%= label_tag("check1", "check box") %>
check_box_tag(ID)
でチェックボックスを出力し、label_tag(ID, 表示テキスト)
でラベルを設定する。
対応アクションの修正をしておく。
####ラジオボタン
radio_button_tag(name値, value値)
:ラジオボタンを作成する、IDはnameとvalueが使われる。
<%= radio_button_tag("r1", "radio 1") %>
<%= label_tag("r1_radio]_1", "Radio Button 1") %><br>
<%= radio_button_tag("r1", "radio 2") %>
<%= label_tag("r1_radio]_2", "Radio Button 2") %><br>
半角スペースはアンダーバーになっている。対応アクションの修正をしておく。
は改行の意味。
####選択リストを使う
select_tag(ID値, 表示する項目)
:選択リストを表示する。
options_for_select(配列)
:selectタグの中に記述するオプションタグを作る。
select_tag(ID, options_for_select(配列))
:上二つの組み合わせ
配列を項目にもつ選択リストを作ることができる。
<%= select_tag('s1',
options_for_select(["Windows", "macOS", "Linux"])) %>
対応アクションの設定しておく。
####複数選択可能なリスト
<%= select_tag('s1',
options_for_select(["Windows", "macOS", "Linux"]),
{size:5, multiple:true, class:"form-control"}) %>
{size:5, multiple:true, class: "form-control"}
multiple
で複数選択が可能に、size
で表示する項目数を変更できる、2つ以上だとプルダウンからリスト方式に。classはBootstrapのクラス。
要コントローラの修正。
複数項目選択の場合は、「選択した項目の配列」が値になる。配列なのでfor inを使って順に取り出して処理しなければいけない。
####他にもヘルパーは色々あるよ
- テキストエリア
- パスワード入力
- 非表示フィールド
- 検索フィールド
- 電話番号入力
- 日時の入力
- URLの入力
- メールアドレスの入力
- 色の選択
- 指定範囲の数値の入力