May 11th,2016
＃
“enctype”属性について
“enctype”属性は“method”属性で“POST”方式を指定したフォームが送信するデータの形式を指定します。
フォームでファイルのアップロードを可能にする場合はmultipart/form-data”を指定する必要があります。
“enctype”属性を省略した場合の既定値は入力されたデータをURLエンコードして送信する“application/x-www-form-urlencoded”です。
フォームの送信ボタンとなる“button”要素や“input”要素に“formenctype”属性が指定されている場合は“formenctype”属性が優先されます。
＃
指定できる値
| 属性値 | 説明 |
|---|---|
| application/x-www-form-urlencoded | 入力されたデータをURLエンコードして送信 |
| multipart/form-data | 入力されたデータをマルチパートデータとして送信 |
text/plain |
入力されたデータをプレーンテキストとして送信 |
値はMIMEタイプですが、仕様で定義されているのは上記の3種類です。
＃
サンプルコード
<form method="post" action="sampleform.php" enctype="multipart/form-data">
<fieldset>
<legend>好きな果物</legend>
<p>
<label><input type="checkbox" name="fruit[]" value="甘蕉">甘蕉</label>
<label><input type="checkbox" name="fruit[]" value="林檎">林檎</label>
<label><input type="checkbox" name="fruit[]" value="甜瓜">甜瓜</label>
<label><input type="checkbox" name="fruit[]" value="苺">苺</label>
<label><input type="checkbox" name="fruit[]" value="桃">桃</label>
</p>
</fieldset>
<fieldset>
<legend>一番好きな果物</legend>
<p><label>果物の画像：<input type="file" name="photo" accept=".png,.jpg,.jpeg,image/png,image/jpeg"></label></p>
</fieldset>
<fieldset>
<legend>あなたの情報</legend>
<p><label>居住地域：<input type="text" name="area"></label></p>
<p><label>年齢：<input type="number" name="age"></label></p>
</fieldset>
<p><input type="submit" value="送信する"></p>
</form>
