a-blog cms のフォームで、全角ひらがな・全角カタカナを入力チェックする方法

a-blog cmsのフォームで入力チェック(検証)するには、フォームオプション(validator)を指定します。これすごく便利な機能で、regex(正規表現にマッチするかを判定)なんてものまで用意されています。
今回はこのregexを使い「全角ひらがな」または「全角カタカナ」に「全角スペース」と「ー」を加えたもので検証しようと思います。ほとんどのフォームで用意されている「名前のふりがな」で使うやつです。

■「全角ひらがな」+「全角スペース」+「ー」の場合

<input id="nameKana" type="text" name="nameKana" class="formSizeHarf" value="{nameKana}" />
<input type="hidden" name="field[]" value="nameKana" />
<input type="hidden" name="nameKana:v#required" />
<input type="hidden" name="nameKana:v#regex" value="^(\xe3(\x81[\x81-\xbf]|\x82[\x80-\x93]|\x83\xbc|\x80\x80))+$" />
<!-- BEGIN nameKana:validator#required -->
<p class="emSection">お名前(ふりがな)を入力してください。</p>
<!-- END nameKana:validator#required -->
<!-- BEGIN nameKana:validator#regex -->
<p class="emSection">「全角ひらがな」で入力してください。</p>
<!-- END nameKana:validator#regex -->

つづいては、

■「全角カタカナ」+「全角スペース」+「ー」の場合

<input id="nameKana" type="text" name="nameKana" class="formSizeHarf" value="{nameKana}" />
<input type="hidden" name="field[]" value="nameKana" />
<input type="hidden" name="nameKana:v#required" />
<input type="hidden" name="nameKana:v#regex" value="^(\xe3(\x82[\xa1-\xbf]|\x83[\x80-\xb6|\xbc]|\x80\x80))+$" />
<!-- BEGIN nameKana:validator#required -->
<p class="emSection">お名前(フリガナ)を入力してください。</p>
<!-- END nameKana:validator#required -->
<!-- BEGIN nameKana:validator#regex -->
<p class="emSection">「全角カタカナ」で入力してください。</p>
<!-- END nameKana:validator#regex -->

ちなみにregexの指定は/と/の中を記述するので、/^[ぁ-ん]+$/u の様にutfの指定が出来ないため直接コードで書いています。ユニコードの対応表はこちらを参考にさせていただきました。今回コードの中で{}は使っていませんが、{}はテンプレートで変数を呼び出す際に利用するため、{}を使う場合は「バックスラッシュ」や「¥」などでエスケープする必要があるようです。

といいながらも正規表現はとっても苦手で初心者レベルなので、間違っていたらすみません。
使う際には十分検証してみてください。


関連記事

この記事のハッシュタグ から関連する記事を表示しています。

a-blog cmsでUTF-8の絵文字対応(CPI ACE01)

a-blog cmsのスマホ表示で縮小された(拡大画像がない)画像を別ウィンドウで開く方法

a-blog cmsでクリッカブルマップでもprettyPhotoを使う方法

a-blog cms ver2.5の新機能「ルールでモジュールIDを切り替える」を使い、表示件数を変更した際にブロック要素の高さを揃える方法

ブログのバージョンアップ

スピーバーのVPSサーバ VP-1でa-blog cmsを動かす

最新記事

カテゴリー

アーカイブ

ハッシュタグ