【CS Cart】正規表現を使って独自のバリデーションを入れる

登録フォームにて、

正規表現を使って独自のバリデーションを追加する事が可能です。

labelのclassにcm-reqexpを追加する

CS Cartではマイクロフォーマットとして、特別なCSSセレクタがあります。

プレフィックスは、cm- (CS-Cart Microformatの略)となり、このCSSスタイルがマイクロフォーマットであることを示します。http://docs.cs-cart.jp/v4.0/docs/microformats

今回は正規表現を使いたいので、

cm-regexpというクラスを使います。

<label for="example" class="cm-regexp">
<input type="text" id="example" value="" />

検証する正規表現を定義する

続いて、値を検証する正規表現を定義していきます。

<label for="example" class="cm-regexp"　data-ca-regexp="{literal}^([0-9]+)${/literal}">
<input type="text" id="example" value="" />

labelにdata属性のdata-ca-regexp=””を追加し、

{liternl}{/literal}で囲った中に正規表現を入れます。

エラーメッセージを定義する

同じくlabelにdata-ca-massage=””を追加し、

エラーメッセージを入れておきます。

<label for="example" class="cm-regexp"　data-ca-regexp="{literal}^([0-9]+)${/literal}" data-ca-message="{__("error_validator_example")}">
<input type="text" id="example" value="" />

これで完成です。

最後に

emailを検証したり、電話番号を検証したりするには

cm-emailやcm-phoneをlabelのクラスに追加するだけでもOKです。

ただ検証ルールを厳しくしたりするには、

このcm-regexpを使って正規表現で指定する方が理想的なバリデーションを作る事ができそうです。

参考：http://docs.cs-cart.jp/v4.0/docs/microformats