背景・実現したいこと
一つ目のドロップダウン(A)で選択した値によって、二つ目のドロップダウン(B)の選択肢を動的に変化させたい。二つ目のドロップダウン(B)にはあらかじめ選択肢としてA,B,C,Dと4つ設定されています。
ドロップダウン(A)の選択が aaa の場合、ドロップダウン(B)の選択肢は A,B になり、ドロップダウン(A)の選択が bbb の場合、ドロップダウン(B)の選択肢は C,D になるというような状態にしたいです。
【フォームブリッジ】ドロップダウンの選択肢を動的に変更する方法 を参考にしてコードを書いてみましたが期待した動作になりません。解決方法を教えて頂けたら幸いです。
URL: https://cybozudev.zendesk.com/hc/ja/community/posts/360055065212#_=_
コンソールログで確認する限りは選択肢が正しく切り替わっているようなのですが、WEBフォーム上のドロップダウン(B)の選択肢は常に A,B,C,D と表示されてしまいます。
利用したソースコード
function switchList(state){
let A = state.record['A'].value;
state.record['B'].options = [];
switch (A) {
case 'aaa':
state.record['B'].options = ['A','B'];
break;
case 'bbb':
state.record['B'].options = ['C','D'];
break;
default:
state.record['B'].options = ['A','B','C','D'];
break;
}
}
fb.events.fields.A.changed = [function(state){
switchList(state);
return state;
}];