formaction属性が指定可能な要素【ウェブデザイン技能検定 1級学科範囲】

令和4年のウェブデザイン技能検定でも出題された内容について、
今回はformないで使用されるformaction属性について詳しく解説します。

formaction属性とは

formaction属性は、form要素や特定のinput要素に使用でき、フォーム送信時の送信先URLを指定するために使用されます。
この属性を使うことで、同じフォームから異なる送信先へデータを送信することができます。

formaction属性が指定可能な要素

formaction属性は以下の要素に指定することができます：

1. input要素（type属性がsubmit、imageの場合）
2. button要素（type属性がsubmitの場合）

input要素の例

<form method="post">
  <input type="text" name="username">
  <input type="submit" value="Submit" formaction="/submit1">
  <input type="submit" value="Submit to Another" formaction="/submit2">
</form>

この例では、二つのsubmitボタンがあり、それぞれ異なる送信先URL（/submit1と/submit2）が指定されています。

button要素の例

<form method="post">
  <input type="text" name="username">
  <button type="submit" formaction="/submit1">Submit</button>
  <button type="submit" formaction="/submit2">Submit to Another</button>
</form>

こちらも同様に、二つのボタンが異なる送信先URLを持っています。

使用される事例

formaction属性は、次のような場合に使用されます：

• 異なる処理を行う複数の送信先がある場合：ユーザーが選択したボタンに応じて、異なる処理を行うために使用されます。
• 同じフォームから複数のアクションを実行する場合：たとえば、注文フォームで「確認」と「最終送信」のように異なるアクションを設定する場合です。

まとめ

formaction属性はフォームの送信先URLを動的に指定するための重要な属性です。
input要素（typeがsubmit、image）やbutton要素（typeがsubmit）に使用でき、ユーザーの選択に応じて異なる送信先にデータを送信することが可能です。
ウェブデザイン技能検定においても、この属性の使い方と用途を理解し、適切に使用することが求められます。