【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を使って正規表現で指定する方が理想的なバリデーションを作る事ができそうです。