フォーム ってなに?

■ フォーム ってどんなもの?

まずはフォームがどのようなものか?ということから話を進めましょう。あまり深く考えず次の例を見て下さい。

情報 アーティスト:
タイトル名 :

ジャンル ロック: メタル: その他:

理由

例のように、文字を入れるスペースや候補から選択するもの(ラジオボックス)、送信ボタンなどなど。これらのことをひっくるめてフォームと呼んでいます。もう少し厳密に言いますと、WEBページ上からWEBサーバや同じページのスクリプトなどに何らかの情報を送信するための入力コーナーのことを言います。

ただし、当サイトで解説しますのは、どのようにフォームの入力部分を作るか、ということだけです。情報の受け取り方や、受け取ったデータをどのように使うか、ということについてはほとんどふれません。興味がある方は「CGI」や「JavaScript」などについて勉強してみて下さい。そしてフォームを構成します、文字の入力欄やチェックボックス、送信ボタンなどをフォームのコントロールと呼びます。

■ フォームの基本

さてフォームをWEBページ上に作る方法なのですが、これは少し複雑な記述となります。情報をどこに送るのか、何を送るのか、どうするのかなどを指定しなければなりませんので当たり前と言えば当たり前ですね。ただ、それぞれのコントロールを作る方法につきましては次のページ以降で順番に一つずつ解説していきますので、ここでは「<form>」タグに的を絞って解説を行います。

情報をどこに送るのか

<form action="./dmy.cgi" method="GET">

上記のように「action」属性にてどこに(どのファイルへ)情報を送るのかを相対パスまたは絶対パスにて指定をします。これは「CGI プログラム」であったり、「maito:」付きのメールアドレスであったりしますが、通常の「HTML」ファイルなどであっても特に問題はありません(情報を送る意味もありませんが)。「action」属性は必須項目となっていますので、必ず指定しなければなりません。

どんな情報を送るのか

<form action="./dmy.cgi" method="GET">コントロール各種</form>

どのような情報をどのような名前で送るのか、ということは各コントロールにて指定します。指定できるコントロールは以下の通りとなっています。

フォームから情報を送る場合に、送るデータがばらばらではどうしようもないですよね。送るデータを一まとめにするために、「ここから」「ここまで」を「action」で指定したファイルに送ります、と宣言するために、各コントロールを「<form>」と「</form>」で囲むのです。

なお、フォームには少なくとも一つの「送信ボタン」(submit)がなければなりません。複数の送信ボタンを設置し、それぞれに「NAME 属性」にて名前を与えておくことにより、押されたボタンを判別することもできます。

また、「<form>〜</form>」の中に「<form>〜</form>」を配置することは出来ません。

情報をどうするのか

<form action="./dmy.cgi" method="GET">

メソッドHTTP 命令内容
1.01.1
GET URI で指定されたデータがファイルの場合はファイルの中身を返す。 CGI プログラムの場合はそのプログラムの出力データを直接返す。
POST クライアントからサーバにデータを送信する。
HEAD URI で指定されたファイルのメッセージヘッダのみを返送する。 ファイルの最終更新日や属性を調べる際に使用する。
PUT URI で指定したサーバ上のファイルを置き換える。 見つからない場合は新規に作成する。
DELETE URI で指定したファイルをサーバ上から削除する。
PATCH- PUT とほぼ同じだが、置き換える差分のみをサーバに送信する。
TRACE- サーバが受け取ったリクエストラインとヘッダをそのまま返信する。
OPTIONS- 通信オプションを通知したり調べたりする際に使用する。
LINK- 他の情報との関連付けを行う。
UNLINK- 関連付けを削除する。