ピッカー内の異なるフィールドの表示

cx-pickerフラグメントで「コンテキスト」パラメータを使用する方法に応じて、実行時にピッカーに異なるフィールドを表示できます。たとえば、ピッカーはフィールドAまたはフィールドBのいずれかを表示できます。

ピッカーで異なるフィールドを表示するには、「コンテキスト」パラメータを使用します。また、次のことを行う必要があります:

「ピッカーの構成」に記載されているアカウント・ピッカーを使用した例を見てみましょう。

この例では、すでに作成したピッカーに「住所」フィールドと「プライマリ担当者」フィールドの両方が含まれています。

「コンテキスト」パラメータを使用すると、カスタム変数の値に応じて、かわりに「アドレス」フィールドまたは「プライマリ担当者」フィールドを表示できます。

この設定方法を次に示します:

1. カスタム変数の作成

まず、ピッカーのオブジェクトにカスタム変数を作成します:

次に、条件(変数の値に応じて表示するフィールド)を、AccountオブジェクトのJSONのピッカー・レイアウト表示プロパティに追加します。

「アカウント」タブで、「JSON」サブタブをクリックします。
ピッカー・レイアウトの表示プロパティを検索します。
表示プロパティ・セクションで、"FormattedAddress"フィールドと"PrimaryContactName"フィールドの2行を1行で置き換えます:

"{{ $componentContext.showContact ? 'PrimaryContactName' : 'FormattedAddress' }}",

最後に、ピッカー・フラグメント自体で変数の値(trueまたはfalse)を定義します。

「レイアウト」サイド・タブで、Payment_cノードをクリックします。
Payment_cタブの「テンプレート」タブで、AccountPickerTemplateテンプレートをクリックします。
このスクリーンショットに示すように、フラグメント・コードが選択されていることを確認します。

ヒント: 「構造」ペインで、ピッカー・テンプレートのフラグメント・コンテナ・ノードを選択すると、同じ処理が実行されます。
cx-pickerフラグメントの「プロパティ」ペインで、「入力パラメータ」セクションで、「コンテキスト」パラメータの値を設定します。 showContact変数をtrueまたはfalseに設定できます:

[[ {'showContact':true} ]]

または

[[ {'showContact':false} ]]

各変数設定をテストできるようになりました。