今回はSalesforce上で、静的リソースに置いたJSONファイルとHTML5を使用して、リスト選択が可能なテキストボックスを作ってみようと思います。
内容の変更が殆ど無い、マスタ系のデータを選択する場合などに使える一つの手段です。
まずは出来上がりの画面を参照してみましょう。
上図のテキストボックス(親)でデータを選択すると、
といった感じの動作を、JSONファイルとJavascriptのみで処理することが出来ます。
では、実際に組み方を説明します。
Jsonファイル(静的リソース名:Bumon)
Jsonファイルは下図のように、
部署配列[部署名・部署コード・グループ配列[グループ名・グループコード]]を変数(SectionLst)へ格納します。
このファイル(UTF-8形式)を静的リソースへ保存、名前は「Bumon」とします。
1 2 3 4 5 6 7 8 9 10 11 |
var SectionLst = [ {"Name":"営業部",<span style="font-size: 8pt;">"SecCd":"1000","Department":[ {"Name":"営業一G","DepCd":"1001"}, {"Name":"営業二G","DepCd":"1002"}, {"Name":"特殊営業G","DepCd":"1003"} ]},</span> {"Name":"技術部","SecCd":"2000","Department":[ {"Name":"コンサルG","DepCd":"2001"}, {"Name":"開発G","DepCd":"2002"} ]} ]; |
次に、上記のJsonファイルを読み込むためにVisualforceページを作成します。
Visualforceコード
以上、これだけでAPI・オブジェクトを消費することなく、便利な入力補助が可能になります。
※但し、入力候補に変更・追加が発生した場合は、静的リソースをその都度アップロードする必要があります。