ドロップダウンの高度なコントロール

このページのチュートリアルでは、[フォーム タスクを作成] アクティビティ内で UiPath フォーム デザイナーを使用してドロップダウン リストを使用する方法を説明します。このチュートリアルの結果を達成するために最もよく使われるプロパティは、FormData(Collection) です。

動的ドロップダウンを作成する

フォーム アクション内のドロップダウン コントロールに値を設定するために、動的なデータの送信を必要とするワークフローで使用します。

この方法では、UiPath フォーム デザイナーの [データ] タブで静的な値を追加する代わりに、文字列リスト型の変数にドロップダウン リストの値を格納します。

以下の例では、国の動的ドロップダウンを作成し、変数を国のリストで初期化して、ユーザーが選択した国を取得するための追加の変数を作成します。

動的ドロップダウンを作成するには、以下の手順を実行します。

1. [フォーム タスクを作成] アクティビティの [フォーム データ] の右にある三点リーダー (...) をクリックします。

2. 以下の設定で、動的なドロップダウンの引数を追加します。

   • 名前: countryList_dropdown
   • 方向: 入力
   • 型: 文字列リスト (List<String>)
   • 値: Ctrl + K を押して、変数名として listOfCountries を入力します。
     listOfCountries 変数には、ドロップダウン リストの項目が格納されます。
     注: 文字列の配列も使用できますが、その場合はフォーム デザイナーでドロップダウン コンポーネントを手動で追加し、[フィールド キー] の値を追加する必要があります。

3. ユーザーの選択をワークフローに返す必要がある場合は、選択された値を取得する別の引数を、以下の設定で追加します。

   • 名前: country (ドロップダウン コンポーネントのフィールド キー)
   • 方向: 入力/出力または出力
   • 型: String
   • 値: Ctrl + K を押して、変数名として selectedCountry を入力します。
4. [OK] をクリックして [フォーム データ] を閉じます。
5. [変数] パネルを開き、new List(of string) from { "India", "Romania", "US" } を既定値 listOfCountries で初期化します。
   ヒント: 初期化する代わりに、他のアクティビティで listOfCountries に値を設定することもできます。

カスケード ドロップダウンを作成する

1 つのドロップダウン (親) で選択した値に応じて第 2 のドロップダウン (子) の値を設定する場合に、タスクベースのフォームで使用します。

カスケード ドロップダウンを作成するには、以下の手順を実行します。

1. [フォーム タスクを作成] アクティビティの [フォーム データ] の右にある三点リーダー (...) をクリックします。

2. 親ドロップダウンをワークフローにバインドします。

   この例では、listOfCountries List<String> 型変数をドロップダウン リストとしてワークフローに渡す引数を作成します。
   注: listOfCountries 変数には、親ドロップダウン リストの項目、つまり国のリストが格納されます。
   1. この引数に CountryList_dropdown という名前を付けます。この引数の [フィールド キー] プロパティの名前は CountryList です。
   2. [方向] を [入力] に設定します。2.3.[型] を System.Collections.Generic.List<System.String> に設定します。
   3. [値] を listOfCountries List<String> 型変数に設定します。

3. 子ドロップダウンをワークフローにバインドします。

   この例では、Dictionary<String, List<String>> 型変数 stateDictionaryList をドロップダウン リストとしてワークフローに渡す引数を作成します。
   注: stateDictionaryList 変数には、子ドロップダウン リストの項目、つまり各国の州が格納されます。
4. この引数に stateDictList_dropdown という名前を付けます。この引数の [フィールド キー] プロパティの名前は stateDictList です。
5. [方向] を [入力] に設定します。3.3.[型] を System.Collections.Generic.Dictionary<System.String, System.Collections.Generic.List<System.String> に設定します。
6. [値] を Dictionary<String, List<String>> 型変数 stateDictionaryList に設定します。

7. 子ドロップダウンを親ドロップダウンにバインドします。

   子ドロップダウンの名前で引数を作成し、サフィックス _parent を追加します。次に、引数の [値] を親ドロップダウンの名前に設定します (例: ”ParentDropdownVariableName”)。
   この例では、stateDictList_parent という名前の引数を作成します。子ドロップダウンは stateDictList であり、そこにサフィックス _parent を追加します。

   1. [方向] を [入力] に設定します。

   2. [型] を String 型に設定します。
   3. [値] を ”CountryList” に設定します。
      Dictionary 型変数 stateDictList に値を設定する際は、ディクショナリのキーは、親ドロップダウン リストの値で、対応する値は、親がそのキーに設定されたときにフォームに表示されるオプションのリストであることに注意してください。
      ヒント:

      [フォーム データ] コレクションに事前に入力される値 (例: 国や州のフィールドの値) を渡すことができます。

      子の値を渡す場合は、予期しない動作が生じないようにするために、必ず親の値も含めてください。

8. 親ドロップダウンから文字列リスト変数に各値をマッピングします。親ドロップダウンのリスト (ディクショナリ) は、任意の方法で入力できますが、この例では、各値に対して [Add to Dictionary] アクティビティを使用します。

   • ディクショナリ: 子ドロップダウンのディクショナリ stateDictList です。
   • キー: 親ドロップダウンの文字列リストからの値 CountryList です。この例では、"US"、"India"、"Romania" です。
   • 値: Ctrl + K を押して、文字列リスト変数の名前を入力します。この変数には、親でキーの値が選択されたときに子ドロップダウンに表示される値、usaStatesList、indianStatesList、romanianCountyList が、それぞれ格納されます。
9. 上記の手順のアクティビティ (1 つまたは複数) は、必ず[フォーム タスクを作成] アクティビティよりも前に配置してください。
10. [OK] をクリックして [フォーム データ] を閉じます。

11. [変数] パネルを開き、作成した新しい文字列リスト変数を次の既定値で初期化します。

    • indianStatesList に対しては new List(of string) from { "Odisha", "Rajasthan", "Karnataka" }
    • usaStatesList に対しては new List(of string) from {"Florida", "Georgia", "Washington"}
    • romanianCountyList に対しては new List(of string) from {"Cluj", "Prahova", "Constanta"}

こちらからこれらのサンプルをダウンロードします。

編集グリッドおよびデータ グリッド コンポーネントでカスケード ドロップダウンを作成する

編集グリッド コンポーネントまたはデータ グリッド コンポーネント内でカスケード ドロップダウンを使用するには、以下の手順を実行します。

1. 上記の手順に従って、ドロップダウン フィールドを作成します ([フォーム データ] ウィザードを使用)。
2. フォーム デザイナーを開きます。

3. ドロップダウン フィールドがフォーム内に作成されない場合は、以下を確認します。

   • <dropdownKey>、<dropdownKey>_dropdown、および <dropdownKey>_parent の各引数が [フォーム データ] コレクションに正しく追加されている。

   • [入力フィールドを生成] ボックスがオンになっている。

4. 編集グリッド コンポーネントまたはデータ グリッド コンポーネントをドラッグ アンド ドロップします。
5. 手順 1 で作成したドロップダウンを編集グリッド コンポーネントまたはデータ グリッド コンポーネントにドラッグ アンド ドロップします。
6. 子ドロップダウンの設定メニューを開きます。

7. [論理] タブで、事前設定済みの高度な論理を確認します。

   
   

   

   
   
8. [アクション] > [スキーマ定義] フィールドに移動します。
9. スキーマ式で、[data.<parent_dropdown_key>] を [row.<parent_dropdown_key>] に置き換えます。
   
   

   

   
   
   注: row キーワードは、グリッド行の親値を使用することをフォームに指示します。
10. フォームを保存します。

ドロップダウンの検索結果の数を設定する

既定では、ドロップダウンに最大 4 つの検索結果が表示されます。この制限は、フォーム設計のプロパティ設定で変更できます。

ドロップダウンの検索結果の数を設定するには、以下の手順を実行します。

1. UiPath フォーム デザイナーで、[編集] をクリックしてドロップダウン リストの設定を開き、[データ] タブを選択します。
2. [Choices.js オプション] に { "searchResultLimit" : x } を追加します。xx は表示する結果の最大数です。

ドロップダウン内のすべてのオプションを表示する

ドロップダウン メニューの文字列が 50 文字を超える場合、表示から省略されることがあります。

検索用語と一致するすべてのオプションを表示するには、次の手順を実行します。

1. 編集するドロップダウン リスト コンポーネントの [JSON を編集] をクリックします。

2. [コンポーネント JSON] フィールドで、以下のプロパティを追加します。

   ...
     "fuseOptions": {
       "distance": 800,
       },
     "threshold": 1,
     "useExactSearch": false,
   ...

注: threshold プロパティは、アルゴリズムが指定の検索用語の検索操作を停止するポイントを指定します。たとえば、threshold が 0 の場合、文字と位置が完全に一致する必要があります。threshold が 1 の場合は、綴りに間違いがあっても、任意の文字に一致できます。ユース ケースに応じて threshold の値を調整してください。