- 追加された行はこの色です。
- 削除された行はこの色です。
[[CodeIgniter]]
#contents
* Form [#r53ca127]
データ入力のユーザーインターフェースを作る。
決まりきった書式なので、悩む余地なし＝時間をかける場所じゃない。一瞬で実装すべし。
決まりきった形式なので、悩む余地なし＝時間をかける場所じゃない。一瞬で実装すべし。
（参考）
- HTMLタグ/フォームタグ - TAG index Webサイト
http://www.tagindex.com/html_tag/form/
- <FORM>－HTMLタグリファレンス
http://www.htmq.com/html/form.shtml
- Form ヘルパ - CodeIgniter ユーザガイド 日本語版
http://codeigniter.jp/user_guide_ja/helpers/form_helper.html
** HTML [#wbc62d0e]
通常のHTMLで表記する場合（復習）
http://www.tagindex.com/html_tag/form/
#code(html){{
<form method="post" action="formmail.cgi">
<p>お名前：<input type="text" name="name" size="50"></p>
<p>メッセージ：<br>
<textarea name="message" cols="50" rows="5"></textarea></p>
<p><input type="submit" value="送信する"></p>
</form>
}}
*** フォーム全体の指定 [#u78eeef8]
- <form action=""> 入力フォームを作る
- <form method="" action=""> データの送信形式と送信先を指定する
#code(html){{
<form method="post" action="example.cgi"> ～ </form>
}}
|属性|値|説明|h
|method=""|get|URIの形式でデータを送信 （初期値）|
|~|post|本文としてデータを送信|
|action=""|URI|データの送信先（プログラム）のURIを指定|
>form要素に method="" を追加すると、データの送信形式を指定することができます。
また、action="" でデータの送信先を指定することができます。
form要素にはaction属性が必須となります。
POST形式 … フォームのデータを本文として送信します（一度に大量のデータを送信することができます）
GET形式 … フォームのデータをURLの末尾に追加して送信します（送信できるデータ量には制限があります）
-- <form method="" action="" target=""> 結果が表示されるウィンドウを指定する
-- <form method="post" action="" enctype=""> 送信時のデータ形式を指定する
*** フォームの部品 [#o9609df5]
- <input type="text"> テキストの入力欄を作る
#code(html){{
<input type="text" name="example2" size="30" maxlength="30" value="サンプル">
}}
- <input type="password"> パスワード形式の入力欄を作る
- <input type="radio"> ラジオボタンを作る
- <input type="checkbox"> チェックボックスを作る
- <input type="file"> ファイルの送信欄を作る
- <input type="hidden"> 隠しデータを送信する
#code(html){{
<input type="hidden" name="example" value="隠しデータ">
}}
- <textarea cols="" rows=""> 複数行のテキスト入力欄を作る
-- <textarea cols="" rows="" wrap=""> テキストの折り返しを制御する
- <select><option> セレクトボックスを作る
#code(html){{
<select name="example" size="3" multiple>
<option value="サンプル1" selected>サンプル1</option>
<option value="サンプル2">サンプル2</option>
<option value="サンプル3">サンプル3</option>
</select>
}}
*** ボタン [#ncc27b1f]
- <input type="submit"><input type="reset"> 送信ボタンとリセットボタンを作る
#code(html){{
<input type="submit" name="button1" value="送信する">
<input type="reset" name="button2" value="リセット">
}}
- <input type="image"> 画像で送信ボタンを作る
#code(html){{
<input type="image" name="button1" src="button.gif" alt="送信する">
<input type="image" name="button2" src="button.gif" alt="送信する" align="middle">
}}
>input要素に type="image" を指定すると、画像を使った送信ボタンを作成することができます。
- <input type="button"> 汎用的なボタンを作る（1）
#code(html){{
<p><input type="button" value="アラート" onclick="alert('これはテストです')"></p>
}}
>input要素に type="button" を指定すると、汎用的に使える押しボタンを作成することができます。
この押しボタンは、主にJavaScriptなどで使用することになります。
- <button type=""> 汎用的なボタンを作る（2）
#code(html){{
<button type="button">ボタンの内容</button>
<button type="submit" name="example" value="ボタン">ボタンの内容</button>
}}
>button要素で、3タイプのボタン（送信ボタン、リセットボタン、汎用ボタン）を作成することができます。
|属性|値|説明|h
|type=""|submit|送信ボタンを作成 （初期値）|
|~|reset|リセットボタンを作成|
|~|button|汎用ボタンを作成|
|name=""|文字列|ボタンの名前を指定|
|value=""|文字列|送信される文字列を指定|
** Formヘルパー [#pf673f61]
CodeIgniterのFormヘルパーを活用
http://codeigniter.jp/user_guide_ja/helpers/form_helper.html
-ヘルパのロード
このヘルパは次のコードを使ってロードします:
$this->load->helper('form');
- form_open() 関数
echo form_open('email/send');
↓
#code(html){{
<form method="post" accept-charset="utf-8" action="http:/example.com/index.php/email/send" />
}}
* バリデーション [#d876e57d]
http://codeigniter.jp/user_guide_ja/libraries/form_validation.html
