フォームの入力項目に初期値を設定する

フォーム上に配置したテキスト入力領域やメニューには、初期値を設定することができます。ここでは、フォームに【クリア】ボタンをつける方法について考えてみましょう。

■　フォームの定義

訪問者が情報を入力するテキスト領域とメニューを配置するための定義を行います。

テキスト領域の定義
<TD>お名前</TD>
<TD><INPUT CLASS="namebox" TYPE="text" SIZE="20" ID="customer" NAME="customer"></TD>
<TD>メール</TD>
<TD><INPUT CLASS="mailbox" TYPE="text" SIZE="20" NAME="email"></TD>
<TD>電話番号</TD>
<TD><INPUT CLASS="telbox" TYPE="text" SIZE="14" NAME="addres"></TD>

メニューの定義
<SELECT CLASS="selectbox" NAME="selectitem">
<option>個人</option>
<option>家族</option>
<option>グループ</option>
<option>法人</option>
<option>組織・団体</option>
</SELECT>

テキスト入力領域の定義
<TD>予約内容</TD>
<TD><TEXTAREA CLASS="textbox" NAME="body" ROWS="4" COLS="60">学校職員向けチュートリアルを申し込みます。</TEXTAREA>
</TD>

■　初期値の設定

フォーム上に配置したテキスト入力領域やメニューは、プロパティを使用することで、項目の初期値を設定しておくことができます。初期値を設定しておくことで、ページが読み込まれた時やクリアボタンがクリックされた時に、特定の値が入力された状態でページを表示することができます。
メ ニューに初期値を設定するには、初期値として設定したい項目を定義する<OPTION>タグの中で「SELECTED」を指定します。
テキスト入力領域の場合、<INPUT>タグで作成したテキスト入力領域と<TEXTAREA>タグで作成したテキスト入力領域では、初期値の設定方法が異なります。<INPUT>タグで作成したテキスト入力領域に初期値を設定する場合は「VALUE」プロパティを使用します。
＜TEXTAREA＞タグで作成したテキスト入力領域には、＜TEXTAREA＞〜</TEXTAREA>の間に記述した文字列が初期値として設定されます。

<<<戻る