[html]formタグの外からsubmitさせる方法

盲点というか無知だった。

こうする

submitするならinputでもbuttonでもok。

<input type="sibmit" form="target" value="submit">
<button type="sibmit" form="target">submit</button>

<form id="target">
︙
</form>

<form>のidをform属性で指定する。

labelにおけるforみたいなものですね。

フォームを劇的に使いやすくする！HTML５の８つの新属性 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作

こんにちは、はやちです。

liginc.co.jp

使い所

例えばECのカートに入れるボタンをPCとSPで位置替えしたいとき。

jsでもって<form>自体とか、<form>を広く取ってsubmitの位置を移動させることを頑張ったりしてたんだけど、完全に開放された。

例えば管理画面での保存ボタンとかも。

ヘッダーを追従するように組んで、ヘッダー上にボタンを設置してあるところが、PCだといいんだけどSPだと幅が足りなくて詰むみたいな。

デザイン切り替えの制限がなくなるのは本当に嬉しい。