Dynamische HTML-Elemente

Mit dynamischen HTML-Elementen können Sie HTML-Inhalt erstellen, der dynamisch angezeigt oder in einem beliebigen Teil des Formulars verwendet werden kann, während das Formular während der Laufzeit geöffnet ist. Sie können beispielsweise ein Bild zuweisen, das dynamisch angezeigt wird, nachdem eine Dropdown-Option ausgewählt wurde, und den Benutzer dann auffordern, das Bildelement in ein Textfeld einzugeben.

Tutorial

So übergeben Sie ein dynamisches HTML-Element:

1. Öffnen Sie in der Aktivität Formular erstellen > Eigenschaften -Panel das Fenster FormFieldsCollection .
2. Fügen Sie ein In -Argument vom Typ String , und benennen Sie es mit einem aussagekräftigen Namen.
3. Öffnen Sie den Formular-Designer und ziehen Sie eine HTML-Element -Komponente in Ihr Formular.
4. Fügen Sie auf der Registerkarte Anzeige > Feld HTML-Tag p für einen neuen HTML-Absatz hinzu.
5. Fügen Sie im Feld Inhalt den Datentyp hinzu, den Sie dynamisch übergeben möchten, indem Sie den Ausdruck {{data.variable}}verwenden, und ersetzen Sie variable durch den Namen des in Schritt 2 erstellten Arguments.

6. Aktivieren Sie das Kontrollkästchen Bei Änderung aktualisieren.

   Hinweis: Um ein Bild in einem HTML-Element -Formularfeld hinzuzufügen, muss das Bild in das Base64-Format konvertiert werden.

   So übergeben Sie ein Bild als dynamisches HTML-Element:

7. Konvertieren Sie das Bild in einen Base64-String.
8. Speichern Sie die Base64-Zeichenfolge als Workflowvariable. Beispiel: image .
9. Öffnen Sie in der Aktivität Formular erstellen > Eigenschaften -Panel das Fenster FormFieldsCollection .
10. Fügen Sie ein In -Argument vom Typ String hinzu, und nennen Sie es sampleImage.
11. Legen Sie die Base64-Zeichenfolge aus Schritt 2 als Value fest.
12. Klicken Sie auf OK , um das Fenster FormFieldsCollection zu schließen.

13. Geben Sie im Formular-Designer > Registerkarte Erweitert > HTML-Elementkomponente > Feld Inhalt den folgenden Ausdruck ein:

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

    Hinweis: Die Basiskomponenten „ Label/Header “ können auch verwendet werden, um Elemente dynamisch zu übergeben. Auf diese Weise können Sie dynamische Beschriftungen und Header für Formularfelder festlegen.