FormBridgeを、javascriptでカスタイマイズのしているのですが、
初心者でうまくできません。教えてください。
他で入力された条件によって、
ラジオボタンの選択肢の文字列を変更したいと思います。
例えば、
FormBridge設計時のラジオボタンは
〇第1便：13:30~13:50
〇第2便：14:00~14:20
となっている予約フォームです。
このラジオボタンの前に入力する内容によって、
〇第1便：13:30~13:50 空きあり
〇第2便：14:00~14:20 空き無し
のように、変更したいと思います。
state.record[‘ラジオボタン’].value で選択されるデータは取れるのですが、
そうではなくて、選択項目を変更したいです。
よろしくお願いします。
@e.imaizumi さん
こんにちは、当方ForumBlidgeは利用していませんがすこし気になったので回答致しました！
まずこちらのリンク
でFormBligeでのJavaScriptのカスタマイズのためのリファレンスを用意してくださっているので確認してみると、
※状態を変更することによりDOMを変更させたい場合は、DOM生成前のイベントで状態を変更しなければなりません。
と書かれているので、 例えば fb.events.form.created イベントでDOM生成前に値を変更してあげることでおっしゃってる文字列を変更できるのではないでしょうか？
Yuki_Minamitani さん
早々の返答ありがとうございます。
DOM生成前は、
要するに入力フォームの生成前っという感じととらえられるでしょうか。
逆に、一度フォームが作成されてしまうと、
ラジオボタンなどの表示文字列を変更したりすることは、
難しいっということになるのでしょうか。
確かに、その部分だけの表示を変えるのは、
性質上、難しそうですね。
選択された日付によって、予約の空き状況が違うので、
該当のラジオボタンの選択前に、入力される日付によって、
表示を変えたいと思っていたのですが、
難しいのかもしれないですね。
なるほどですね、日付を変更した時にラジオボタンの表示を変えたいのですね。
上記のリファレンスの中に
fb.events.fields.{fieldCode}.changed イベント
もございましたので、例えば日付フィールドが変更されたと時にイベント発火させて、
あとは、 QuerySelector()(下記に参考リンク貼りますね。)などで対象のラジオボタンのDOM取得して、innerHTMLに変更を加えるとかですかね…
なるほど、innerHTMLに変える という方法があるのですね。
未熟なので、だいぶん勉強しないと実現できなさそうですが、
チャレンジしてみます。
ありがとうございます。
いえいえ、もしまたこの辺で詰まった！などございましたら、こちらのコミュニティーには経験豊富な方がたくさんおられて、何かヒントになる事教えてくださるかもしれませんのでお気軽にご質問くださいね！