FROM CACHE - jp_header
解決済

お問合せフォームのエンターキーによる誤送信防止につきまして

るん
Shopify Partner
79 3 10

いつもお世話になっております。

Dawnのお問合せフォームを使用しています。

 

フォームを入力する際、テキストエリア以外の項目を入力中にエンターキーを押すとフォームが送信できてしまいます。

送信ボタンを押す以外では、フォームを送信できないようにしたいです。

 

通常の HTMLであればJavaScriptで制御する方法もあるようですが、formタグにonsubmit="return false;"をつける方法しか見つけられませんでした。

Liquidのformタグを使用し、onsubmit: 'return false;'を追加してみましたが、効いていないようです。

 

フォームの入力途中に誤送信してしまうのを防ぐにはどのような方法がありますでしょうか?

よろしくお願いいたします。

 

1 件の受理された解決策

Qcoltd
Shopify Partner
1051 429 417

成功

@るん 様

 

こちらの記事が参考になるかもしれません。

https://style01.net/721/

 

formタグに、onsubmit="return false;" を設定するだけでは不足なようでして、

送信ボタンを、<input type="button">にする必要があるようです。

 

Dawnでは、送信ボタンは<button type="submit">なので、

これを、<input type="button" value="送信する" onclick="submit();"> にしてみるのはどうでしょうか?

 

ご参考まで。

(キュー田辺)

株式会社Q (キュー)
グラフィックデザイン、アパレル事業、Web制作など色々やっている渋谷区代々木の会社です。ShopifyでのECサイトの運営・開発も行なっています。
私たちについて: https://web.q-co.jp/ テックブログ: https://techlab.q-co.jp/

元の投稿で解決策を見る

2件の返信2

Qcoltd
Shopify Partner
1051 429 417

成功

@るん 様

 

こちらの記事が参考になるかもしれません。

https://style01.net/721/

 

formタグに、onsubmit="return false;" を設定するだけでは不足なようでして、

送信ボタンを、<input type="button">にする必要があるようです。

 

Dawnでは、送信ボタンは<button type="submit">なので、

これを、<input type="button" value="送信する" onclick="submit();"> にしてみるのはどうでしょうか?

 

ご参考まで。

(キュー田辺)

株式会社Q (キュー)
グラフィックデザイン、アパレル事業、Web制作など色々やっている渋谷区代々木の会社です。ShopifyでのECサイトの運営・開発も行なっています。
私たちについて: https://web.q-co.jp/ テックブログ: https://techlab.q-co.jp/
るん
Shopify Partner
79 3 10

株式会社Q 田辺様

 

ご回答ありがとうございます。

ボタンを変更したらエンターキーを押してもフォームが送信されなくなりました。

ありがとうございました。