フォーム デザイナーのコントロールについて

コンポーネントをドラッグ アンド ドロップするか、フォーム コンポーネントの [編集] アイコンをクリックすると、設定ウィザードが開きます。フォーム コンポーネントの種類に応じて、ウィザードの特定のタブが利用可能になり、そのタブを使用してフォームをカスタマイズできます。UiPath フォーム デザイナーで利用可能なすべてのタブとその全般的なプロパティを以下に示します。

表示

• ラベル - コンポーネントのタイトルです。

• ラベル位置 - フィールドのラベルの位置です。

• 説明 - 入力フィールドの下に表示されるテキストです。

• Tooltip - Adds a tooltip icon to the side of the field. Input the text of the tooltip.

• Hidden - Hide a component in the Form Renderer.

• ラベルを非表示 - コンポーネントのラベルを非表示にします。

• 無効 - フォームのフィールドを無効化します。

• プレースホルダー - フィールドが空の場合に表示されるテキストです。

• Prefix - The text that shows before a field.

• Suffix - The text that shows after a field.

• Table View - When checked, shows the value within the table view of the submissions.

• Input Mask - An input mask provides a predefined format. For a phone-number field, the default input mask is [phone].

  定型入力の要素は次のとおりです。

  • 9 - 数値
  • a - アルファベット順
  • * - 英数字

データ

• Default Value - The value of the field before users interacting with it. The default value overrides the placeholder text.
• Multiple Values - When checked, multiple values can be added to the field. The Add Another Button becomes visible in the field.
• コンテンツ - コンポーネントのコンテンツを入力するセクションです。
• Format - The moment.js format you use for saving this field. For example, HH:mm:ss.
• 変更時に再描画 - フォーム内の別のコンポーネントが変更された場合にこのコンポーネントを再描画します。コンポーネントを再描画するイベントをドロップダウン リストから選択します。既定で選択するイベントは、[変更時] と [送信] です。

検証

• 必須 - オンにすると、このフィールドでは値が必須になります。
• 検証実行 - このコンポーネントがフロントエンド検証をトリガーするタイミングを指定します。ドロップダウン リストからイベント ([変更] または [ぼかす]) を選択します。
• 最小の長さ - このフィールドの長さの最低要件です。
• 最大の長さ - このフィールドの長さの最長要件です。
• 最小の単語の長さ - このコンポーネントに追加可能な最小の語数です。
• Maximum Word Length - The maximum amount of words that can be added to this field.
• Regular Expression Pattern - This is the regular expression pattern that the component must pass, before the form can be submitted.
• エラー ラベル - 検証エラー メッセージが表示されるときに表示するラベルです。
• カスタム エラー メッセージ - エラーが発生した場合に表示される、カスタマイズされたエラー メッセージです。

フィールド キー

• Property Name - The name of this component in the Workflow Fields Collection.

条件

フォーム デザイナーの [条件] タブでは、フォーム内のコンポーネントに条件を設定して、コンポーネントを表示または非表示にすることができます。

[条件] タブには、次の[シンプル]セクションがあります。

[条件] タブの [シンプル] セクションでは、コンポーネントを、別のコンポーネントの値に基づいて表示または非表示にすることができます。

[シンプル] セクションは、次の 3 つのフィールドで構成されます。

1. このコンポーネントを表示 - このドロップダウン リストから以下を選択します。

   • コンポーネントを表示する条件を設定する場合は [True] を選択します。
   • コンポーネントを非表示にする条件を設定する場合は [False] を選択します。

2. 条件として使用するフォーム コンポーネント - このドロップダウン リストから、条件として機能させるフォーム内のコンポーネントを選択します。

3. 条件として使用する値 - コンポーネントを表示または非表示にする条件となる値を入力します。

   

フォーム アクティビティに関する 、簡単な条件の作成を説明するチュートリアル についてはこちらをご覧ください。

論理

フォーム デザイナーの [論理] タブでは、条件や高度な論理スクリプトを作成し、それによって、選択したフォーム コンポーネントのステートや動作を変更できます。

高度な論理を使用すると、フォーム コンポーネントのコントロール、外観、操作感を動的に変更できます。

フォームの論理は、トリガーとアクションの 2 つの部分で構成されます。

トリガー

論理のトリガーは、アクションが発生する条件です。たとえば、チェックボックス オプションが選択されている場合にのみ、特定のフォーム フィールドを表示できます。この場合、チェックボックス オプションがトリガーになり、フォーム フィールドの表示がアクションになります。

論理トリガーには次の 4 種類があります。

トリガーの種類	説明	例
Simple	1 つのトリガー フォーム コンポーネントと値を定義します。
JavaScript	フォーム コンポーネントまたはフォーム データの JavaScript 論理を指定します。 ループや動的な動作など、複雑なロジックを作成するには、JavaScript 構文を使用します。
JSON 論理	フォーム コンポーネントまたはフォーム データの JSON 論理を指定します。 JavaScript を使用できない場合に推奨されます。 ループや動的な動作をサポートすることはできません。
イベント	コンポーネント イベントを定義します。対応するコンポーネントによってこのイベントが生成されると、目的のアクションがトリガーされます。

操作

論理アクションは、設定した論理条件 (トリガー) に基づいて発生させるフォーム コンポーネントの動作です。たとえば、特定の年齢のユーザーに対してボタンをアクティブ化できます。この場合、年齢範囲がトリガーになり、ボタンのアクティブ化がアクションになります。

論理アクションには、次の 4 種類があります。

アクションの種類	説明	例
プロパティ	トリガーは、利用可能なコンポーネントのプロパティ (ツールチップ、説明、CSS クラスなど) のいずれかを変更します。 利用可能なプロパティは、トリガー コンポーネントの種類によって異なります。
値 (Value)	トリガーによって、対応するコンポーネントの値を変更します。 アクションは JavaScript 構文を使用して定義する必要があります。
コンポーネント スキーマをマージ	トリガーによって、コンポーネント JSON で見つかったコンポーネント スキーマ パラメーターを変更します。 変更できるスキーマ パラメーターを確認するには、対応するコンポーネント上でホバーして [JSON を編集] をクリックします。 1 つのアクション内で複数のパラメーターを変更できます。
カスタム アクション	JavaScript のトリガーの種類を定義する場合と同じように、JavaScript 構文を使用してカスタム アクションを定義します。	NA

テンプレート

[テンプレート] タブは、 編集グリッド コンポーネントにのみ固有です。フッター テンプレートを使用すると、JavaScript を使用してグリッドをカスタマイズできます。フッターの外観を変更できます。

• Footer Template - This is the Lodash Template used to render the footer of the Edit Grid component.

  以下の 2 つの変数を使用できます。

  • value - 行データの配列です。
  • components - グリッド内のコンポーネントの配列です。

ファイル

[ファイル] タブは、ファイル コンポーネント専用です。[ファイル] タブでは、特定の設定とプロパティを使用してファイル コンポーネントをカスタマイズできます。

以下が [ファイル] タブで利用可能なプロパティです。

• ディレクトリ - このコンポーネントにアップロードされたすべてのファイルを、指定したディレクトリに配置します。文字列は /で終わる必要があります。

• アップロードのみ - ユーザーにファイルのアップロードのみを許可します。オンにすると、ダウンロード オプションが使用できなくなります。

• ファイルの種類 - ユーザーがアップロードするファイルの種類を分類するために、ファイルの種類を指定できます。ユーザーが複数種類のファイルをアップロードする際に、ユーザーにアップロードする各ファイルの種類を指定して欲しい場合に推奨します。

• ファイル パターン - アップロード可能なファイル拡張子を指定できます。指定されていない他のファイル拡張子はアップロードされません。

• ファイルの最小サイズ - アップロードするファイルの最小サイズを設定します。

• ファイルの最大サイズ - アップロードされるファイルの最大サイズを設定します。ファイルのパターンとサイズの指定方法の詳細については、この GitHub リンクを参照してください。