jQuery・Javascript jQueryを使った小技やAjax非同期通信などについて

フォーム入力で必須ではないが入力値を制限したいケース

2015年4月10日
この記事は掲載から865日経過しています。
情報が古い可能性が有りますのでご了承下さい

フォームの入力チェックにjQueryなど、javascriptで処理することが有りますが、これが必須有りきじゃないケースが有ります。例えばデータベースにインサートするフォームで、数字のみに制限したいけど、必須じゃないので入力チェックを組み込めないなんて事は割と有ります。せっかくその場でチェックしているのに、そこだけPOST後にチェックとか微妙ですよね。

で、こんな事をやります。

フォームは以下のような形で書きます。

これは数字とメールアドレスだけを例にしていますが、正規表現で色々な形式を設定すれば汎用的に使えます。

img

やっている事は単純で、フォームからフォーカスが外れたら入力チェックを行い、数字じゃなければvalueを元の値に書き変えてメッセージを出すってだけです。まぁこれにPOST停止を組み込めば、普通の入力チェックjavascriptになっちゃうのですが、そこはご愛嬌。

 

  • このエントリーをはてなブックマークに追加
  • LINEで送る

このカテゴリーのその他の記事

PAGE TOP