input type buttonでのrequiredが効かない。

###実現したいこと
ボタンタイプのonclickで送信するフォームで入力必須項目を設定したい。
input typeをsubmitにすると、入力中のEnterで送信してしまう為、input type=buttonにしています。Enterを押した時に、送信しない処理でも構いません。

HTML
1<form action="edit.php" method="post">
2
3<input type ="text" name="workgroup" style="width:100px" required>
4他のinput項目～～
5
6<input type="button" class ="add" value="追加" onclick="window.location.reload(true),submit();">

行動規範の内容に同意します

回答2件

ベストアンサー

どういう処理をしたいのかがわかりませんが、window.location.reload(true),submit(); のsubmit();はその前にページがリロードされてしまうため実行されないと思います。

【Location.reload() - Web API | MDN】
https://developer.mozilla.org/ja/docs/Web/API/Location/reload

投稿2019/12/26 07:29

kei344

総合スコア69596

kingkamehameha

2019/12/26 07:35

その前のリロードで、処理は終了するという訳ですね。なんとかデーターベースには書き込まれているようです。

行動規範の内容に同意します

required属性は、HTMLの仕様としてform送信する場合に機能するものと思われます。
よって、type="button"は、HTMLの仕様としては、何もしない、ボタンなので、
JavaScriptでの、requiredに相当する処理をしなければいけないのかと。

Enterを押した時に、送信しない処理でも構いません。

お察しの通り、type="submit"の場合は、required属性が機能しますが、Enterキー押下時の処理が必要になるでしょう。
しかし、これにはお答えしません。
なぜなら、まず自身でやってみたというコードがなければ、やりたいことだけを述べた丸投げ質問に該当するからです。
まずはご自分で調べましょう。

投稿2019/12/26 07:32

編集2019/12/26 07:34