ショッピングサイトにおける会員登録や、アンケート等、WEBサイト上で個人情報や回答等を入力し、送信ボタンを押した経験のある方は、沢山おられるかと思います。
これらの入力フォーム自体は、htmlの一部ですが、データの表示や入力値のチェック処理は、javascriptが使われる事が多く、フォームの種類や記述方法について、ここでは解説致します。
<input name=‘‘任意の名前’’ type=‘‘フォームの型’’>
を指定
フォームの型には、色々なものがありますの、その用途と合わせて具体的な記述方法を解説します。
名前や郵便番号、電話番号、住所等、様々な用途のテキストの入力に利用されます。
例えば、電話番号の入力の場合、
<input name=‘‘tel’’ type=‘‘text’’>と記述すると、telというフォームの中に、利用者の入力した電話番号がセットされます。
複数の値から、選択する場合に利用されます。
例えば、質問に対する、YES又はNOを選択するような場合で、初期値をNOとするときは
<input type=”radio” name=”question1″ value=”yes”>YES
<input type=”radio” name=”question1″ value=”no” checked>NO
と表記します。
複数の値から選択する際に、値をプルダウン形式で選択します。
先ほどのラジオボタンと例を、プルダウンで表記すると
<select name=”question1″>
<option value=”yes”>YES</option>
<option value=”no” selected> NO</option >
</select>
となります。
個人情報提供の確認等をチェックする際のフォームです。
初期値がブランクの場合は
<input type=”checkbox” name=”test” value=”doui” >同意する
初期値がチェック済みの場合は
<input type=”checkbox” name=”test” value=”doui” checked>同意する
と表記します。
フォームを入力後に、送信するボタンは
” <input type=”submit” value=”送信する”> “
フォームの入力内容をリセットする場合は
” <input type=”reset” value=”リセット”> “
等の、ボタンを設置します。
これらのフォームは、フォームタグにおいて以下のように記述し、送信ボタン(submit)押下後の動作を定義します。
<form method=”post” action=”フォーム送信先”>
次回から、本格的なプログラミング記述に入ります。