動的な HTML 要素

動的な HTML 要素を使用すると、実行時にフォームが開いていれば、フォームの任意の部分で動的に表示または使用できる HTML コンテンツを作成できます。たとえば、ドロップダウン オプションを選択すると動的に表示される画像を割り当てて、ユーザーにテキスト フィールドに画像項目を入力するように求めることができます。

チュートリアル

動的な HTML 要素を渡すには、以下の手順を実行します。

1. [フォームを作成] アクティビティ > [プロパティ] パネルで、[フォーム フィールド コレクション] ウィンドウを開きます。
2. String 型の入力引数を追加して、わかりやすい名前を付けます。
3. フォーム デザイナーを開き、目的のフォームに HTML 要素コンポーネントをドラッグします。
4. [表示] タブ > [HTML タグ] フィールドで、新しい HTML 段落として p を追加します。
5. [コンテンツ] フィールドで、式 {{data.variable}} を使用して動的に渡すデータの種類を追加し、variable を、手順 2 で作成した引数の名前に置き換えます。

6. [変更時に更新] チェック ボックスを選択します。

   注: HTML 要素フォーム フィールドに画像を追加するには、画像を Base64 形式に変換する必要があります。

   画像を動的な HTML 要素として渡すには、以下の手順を実行します。

7. 画像を Base64 文字列に変換します。
8. この Base64 文字列をワークフロー変数として保存します (例: image)。
9. [フォームを作成] アクティビティ > [プロパティ] パネルで、[フォーム フィールド コレクション] ウィンドウを開きます。
10. String 型の入力引数を追加して、sampleImage という名前を付けます。
11. 手順 2 の Base64 文字列を値として設定します。
12. [OK] をクリックして [フォーム フィールド コレクション] ウィンドウを閉じます。

13. フォーム デザイナー > [詳細設定] タブ > HTML 要素コンポーネント > [コンテンツ] フィールドで、以下の式を入力します。

    <img href={{data.sampleImage}} height=100 width=100/>

    注: 基本コンポーネント [ラベル/ヘッダー] を使用して、要素を動的に渡すことも可能です。これにより、フォームのフィールドに動的なラベルとヘッダーを設定できます。