フォームブリッジ バリデーションの書き方について

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

DOM作成前に非表示の処理とバリデーション処理を行いたいです。
フォームブリッジのカスタマイズページではバリデーションは、
fb.events.form.created.push(function (state)
から始まっており、フォームのDOMを作成する前のイベントの最後にバリデーション処理を持ってくるためと認識しております。

もう一方の非表示処理は、

fb.events.form.created = [function (state)

で書いているのですが、

同じイベントなのでまとめて書きたいのです。

どのように書けば、バリデーションが最後に処理される書き方になるかを教えていただきたいです。

 

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

Oさん

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

「fb.events.form.created」には、コールバック関数を配列で指定します。

fb.events.form.created = [function (state) だと上書き(それまでに追加していたコールバック関数は消える)、
fb.events.form.created.push(function (state) だとコールバック関数を追加(それまでに追加していたコールバック関数は消える)という違いがあります。

イメージとしては、下記の違いと同様です。

let a = [1];
a = [2];
console.log(a); // -> [2]

let a = [1];
a.push(2);
console.log(a); // -> [1, 2]

バリデーション以外の場合でも、特別な理由がない限りは、fb.events.form.created.push(function (state) を用いるのが良いかと思います。

 

>同じイベントなのでまとめて書きたいのです。どのように書けば、バリデーションが最後に処理される書き方になるかを教えていただきたいです。

実行順序に関しては、コードを見てみないとわからないです。
基本的にはコードの上から下へ順に読み込まれますが、非同期処理などがあると変わってきます。

単純に一つのコールバック関数内にまとめて、非表示処理を上、バリデーション処理を下に記述して動作しませんか?

fb.events.form.created.push(function (state){
  // 非表示処理
  // ...
  // バリデーション処理
  // ...
  return state;
});

江田様

ご回答ありがとうございます。
まとめて書くことができました。

非表示処理については以下のサイトを参考に記述しました。
https://developer.cybozu.io/hc/ja/community/posts/360047545411-%E3%83%95%E3%82%A9%E3%83%BC%E3%83%A0%E3%83%96%E3%83%AA%E3%83%83%E3%82%B8%E3%81%AE%E3%83%95%E3%82%A3%E3%83%BC%E3%83%AB%E3%83%89%E3%81%AE%E9%9D%9E%E6%B4%BB%E6%80%A7%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6
バリデーションは公式に記載されている書き方です。

非同期処理にはどちらも当たらないと思っているのですが、認識が合っているか確認いただけると嬉しいです。
よろしくお願いします。

Oさん

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

左様でしたら、どちらも非同期処理には当たらないです。
現状の記述方法で問題ないかと思います。

このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。