search
LoginSignup
8

More than 1 year has passed since last update.

posted at

updated at

formにsubmit先が異なる複数のボタンを設置する

1つのformに送信先が異なる複数のボタンを設置する必要があったのですが、盛大にハマってしまったので備忘録です。

方法

index.html
<form method="POST" action="?">
  <input type="checkbox" name="tests[]" value="test1" />test1
  <input type="checkbox" name="tests[]" value="test2" />test2
  <input type="checkbox" name="tests[]" value="test3" />test3
  <button type="submit" name="_method" value="post" formaction="送信先のアドレス"></button>
  <button type="submit" name="_method" value="delete" formaction="送信先のアドレス"></button>
</form>

解説

ポイントはformタグのaction属性値を「?」にすることです。

formタグ内にsubmitボタンが1つの場合は、「送信先のアドレス」を設定しますが、
今回のような複数のsubmitボタンを用意する場合は、「送信先のアドレス」をbuttonタグのformaction属性に設定します。

ちなみにこのformaction属性はHTML5から使えるようになりました。

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
What you can do with signing up
8