あじちゃんのブログ。備忘録。

〜SEもOLなんですかね?

webの送信処理についての基礎

formタグについて

送信をするためにはformタグを用いる必要があります.(Ajax通信を用いる場合やHTML5の場合は不要)
<form>~</form> の間には(formタグを入れ子にする以外)どんなタグが埋め込まれていても問題ありません.

formタグには必須の属性が2つあります.

  • action属性
  • method属性

action属性

送信先のファイルのパスを指定します.
送信ボタンを押した際に,ここで指定したファイルにデータの送信とページ遷移を行います.

method

送信の方法を指定します.
POST/GETのいずれかを指定します. POSTは秘匿性があり個人情報の送信などに強く、GETは公開性がありアクセスログの開示を容易にしたりアドレスバーへの表示で渡した条件をユーザに見せることができます.

inputタグについて

inputタグは送信する値を定義するタグで,基本的に <form>~</form> の間に設置します.
※これがないと値はなにも送信されません

inputタグには必須の属性は3つです

  • type属性
  • name属性
  • value属性(入力フィールド以外は必須)

name属性

サーバー側が送信された値を受け取る時に必要なラベルになります. 詳細は下記の「送信後の例」をみてください.

type属性

入力される要素のタイプ(種類)を指定するもので、たくさんの種類があります.
入力する値に応じて適切な属性を指定する必要があります.
参考:<input>:HTML5タグリファレンス

value属性

name属性の値とセットでプログラム側に送られます.
input type="text" のようにユーザが入力できる場合には, value属性の値は空( value="" )または属性自体を省略してもOKですが,
その他のラジオボタン, チェックボックス, プルダウン等ではチェックされたinputのvalueを送信することからvalueが必須となります.

送信後の例

もし、以下のような input が定義されていた場合、

<form action="/" method="GET">
  <input type="text" name="ジュース" value="贅沢みかん" >
</form>

送信される値はvalue属性に指定されている「贅沢みかん」となります.
受け取り側では、

$_GET['ジュース']

のように、nameで指定した名称からvalueを得ることができます.
つまりname属性が無いと, どの入力データであるのかがプログラム側で判断できないためname属性が必須扱いなのです.