HTML5 フォームの入力 カンマ区切り禁止

Question

HTML5で仕様になった入力値チェックですが
フォームの入力にカンマ区切り禁止（半角カンマ）が入っているかを実装したいのですが
わからなく困っております。

入力されたデータでCSVを作成するのですが「カンマ」が入力されるとずれてしまいます。

受取り側でカンマを削除する方法は知っていますが入力時にチェックが出来れば良いと考えております。

<input type="text" name="name" required>

に制限を掛けたいと思っております。

ご教示いただけますでしょうか。宜しくお願いいたします。

Answer 1

pattern属性を使えば、正規表現で入力値の制限ができます。

<input type="text" name="name" required pattern="[^,]*">

なお、すでにサーバサイドで処理しているようなので特に問題はないですが、patternを認識しないブラウザがあったり、開発ツールで改変することも可能だったりしますので、完全に弾けるわけではないことは注意してください。

Comments

[efu_akio]

できました！何日も悩んでいたのですが解決しました。
「完全に弾けるわけではない」気を付けて対応しようと思います。
ありがとうございます。