新規投稿
フォローする

フォームブリッジ上でのバリデーションについて

お世話になっております。

フォームブリッジで作成したフォーム上で、カスタマイズしたバリデーションを実装したいのですが、kintoneカスタマイズのように、

event.record.{field_name}.error = "error message"

のような形でエラーをだすことはできないのでしょうか。

お手数ですが、よろしくお願いいたします。

0

16件のコメント

Avatar
落合 雄一

どういったバリデーションをお考えでしょうか?

一般的なバリデーションであれば、「fb.events.form.created イベント」でフィールドにバリデーションを追加することでできるかもしれません。

半角英数字の例:

```

(function() {
"use strict";

fb.events.form.created = [function (state) {
console.log(state);
state.form.title = 'edit form title';
state.fields[0].validations.push({rule: 'alpha_num', params: {}});

return state;
}];
})();

```

 

完全に独自のものを通常のバリデーションと同じようにエラーを出すことは難しいかと思います。

この場合、「メッセージ表示」を利用して右上にエラーメッセージを表示することになるかと思います。

必須で非表示なフィールドを用意しておいて、バリデーションが通ったら適当な値を入れて回答できるようにすれば良いかもしれません。

(非表示でもバリデーションエラーが発生すると回答できない仕様を利用します)

 

以上、参考になりますでしょうか?

1
Avatar
Yujiro Shin

ご回答ありがとうございます。

>完全に独自のものを通常のバリデーションと同じようにエラーを出すことは難しいかと思います。
>この場合、「メッセージ表示」を利用して右上にエラーメッセージを表示することになるかと思います

やはりそうなんですね。。。

ご回答いただいたやりかたで検討いたします。

ありがとうございました!

0
Avatar
Yujiro Shin

落合様

お世話になっております。
1点追加でご質問がございます。

>state.fields[0].validations.push({rule: 'alpha_num', params: {}})

こちらのバリデーションのセットで、ruleに指定できるものとしては他に何がございますでしょうか。
以下のような記事を見つけたのですが、これと同じようなものが利用できるという認識であっておりますでしょうか。

http://qiita.com/fagai/items/9904409d3703ef6f79a2

よろしくお願いいたします。

0
Avatar
落合 雄一

以下のバリデーションがありますが、公式にこれらのバリデーションの動作が保証されているわけではないので、使えそうなら使うといったスタンスが良いかと思います。

 

alpha_sign : 半角英数字か @ . - _

not_sign : - _ 以外の記号が使えない

alpha_dash : 半角英数字か - _

alpha_num : 半角英数字

alpha_spaces : 半角英字かスペース

alpha : 半角英字

between : min以上max以下

confirmed : 値の確認

credit_card : クレジットカード情報

decimal : 小数点decimals桁の数値

digits : length桁以上の数値

dimensions : width px × height px以内の画像

email : メールアドレス

ext : 拡張子

image : 画像ファイル

in : 選択肢

ip : IPアドレス

max : length文字以内

max_value : max以下

mimes : ファイルタイプ

min : length文字以上

min_value : min以上

not_in : 選択肢以外

numeric : 半角数値

regex : 正規表現

required : 必須

size : size KB以下のファイル

url : URL

tel : 電話番号

 

以上、参考になりますでしょうか?

2
Avatar
Yujiro Shin

落合様

ご回答ありがとうございます。
何度も質問してしまって申し訳ないのですが、以下について伺いたく存じます。

>regex : 正規表現

こちらについては

・正規表現をこちらで設定できるということでしょうか。
・その際のエラーや正規表現はどのように設定すればよろしいのでしょうか。

以上です。
私の知識不足もあり、お手数おかけいたしますが、何卒よろしくお願いいたします。

0
Avatar
落合 雄一

正規表現を使った時のエラーメッセージは、「入力できないフォーマットです」で変更は難しいかと思います。

正規表現のJSは、以下のようになります。

例は数値のみの正規表現です。

(function() {
"use strict";

fb.events.form.created = [function (state) {
state.fields[0].validations.push({rule: 'regex', params: /^([0-9]+)$/});

return state;
}];
})();

以上、参考になりますでしょうか?
0
Avatar
Yujiro Shin

落合様

お世話になっております。

ご回答いただきありがとうございます。
いただいたコードを参考に下記の通り実装してみたのですが、上手くバリデーションが実行されませんでした。

(function() {
"use strict";

  fb.events.form.created = [function (state) {
    console.log(state);
    state.form.title = 'edit form title';
    state.fields[2].validations.push({rule: 'regex', params: /^([0-9]+)$/});

   console.log (state);
   return state;
  }];
})();

ブラウザのコンソールより、state.fields[2].validations.ruleにregexが追加されていることは確認できております。
どこかコードに間違いがあるのでしょうか。

0
Avatar
落合 雄一

Yujiro Shinさん

 

確かに、上記のコードでうまく動作しないようですね。

近日リリース予定のVersion1.4では動作したので、リリースをお待ちいただくのが良いかと思います。

以上、よろしくお願いします。

0
Avatar
Yujiro Shin

落合様


ご回答ありがとうございます。

それではVersion1.4をお待ちしております。

よろしくお願いいたします。

 

0
Avatar
Yujiro Shin

落合様


お世話になっております。

先日、ver1.4のリリースが近日とのことでしたが、いつくらいになるかなどの目安っていただけますでしょうか。

リリース後のバリデーション実装を前提に構築を進めているものもあり、
可能であればお知らせいただきたく存じます。

何卒よろしくお願いいたします。

 

0
Avatar
落合 雄一

Yujiro Shinさん

 

リリースが遅くなってすいません。

早ければ今週末、遅くても来週中のリリースを考えています。

以上、よろしくお願いします。

0
Avatar
Yujiro Shin

落合様

ご回答ありがとうございます。

よろしくお願いいたします。

0
Avatar
落合 雄一

Yujiro Shinさん

Form Bridge の Version1.4.0 をリリースしました。

https://fb.kintoneapp.com/user/update.html

1
Avatar
Yujiro Shin

落合様

ご報告ありがとうございます!

1
Avatar
Yujiro Shin

落合様

お世話になっております。

すみません、1点念のための確認なのですが、
正規表現を使った時のエラーメッセージは、「入力できないフォーマットです」については
引き続き変更不可の状態であるということでお間違いないでしょうか。

よろしくお願いいたします。

 

0
Avatar
落合 雄一

Yujiro Shinさん

 

そうですね。

バリデーションのエラーメッセージは変更できません。

以上、よろしくお願いします。

0
サインインしてコメントを残してください。