今日の教科書
ページ作成を発展させる
リダイレクトとパラメータ送付
リダイレクト:別のアクションへの処理の転送
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>
１で送信先に本文を送信する。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の入力
- メールアドレスの入力
- 色の選択
- 指定範囲の数値の入力