Multi File Upload Widget in Jitterbit App Builder

Beschreibung

Dieses Widget wurde im Januar 2022 aktualisiert

Das Multi File Upload Widget verwendet die FilePond-Bibliothek, die unter https://github.com/pqina/filepond zu finden ist. Dieses Widget ermöglicht das gleichzeitige oder asynchrone Hochladen mehrerer Dateien, indem Dateien vorübergehend in einer einzelnen Spalte gespeichert und das Speicherevent genutzt wird, um die Datei-Binärdaten abzurufen und in eine separate Tabelle zu verschieben, wo sie weiter verarbeitet oder in ein lokales oder Netzwerk-Dateisystem verschoben werden können.

• Ursprünglicher Ersteller: JP Fortier
• Aktualisiert von: Andros Haggins & Shrey Kumar
• Typ: Steuerungs-Widget

• Parameter:

  Parametername	Standard	Übersetzbar	Beschreibung
  allowImagePreview	1	Nein	Vorschau für Bilddateitypen aktivieren (1) oder deaktivieren (0).
  allowMultiple	1	Nein	Hinzufügen mehrerer Dateien aktivieren (1) oder deaktivieren (0).
  forceReload	1	Nein	Globales Neuladen aktivieren (1) oder deaktivieren (0) nach dem Hochladen einer Datei-Batch.
  maxParallelUploads	1	Nein	Maximale Anzahl von Dateien, die parallel hochgeladen werden können. Maximal getestet sind 100.
  runSave	1	Nein	Speicherevent für jede hochgeladene Datei in der Datei-Spalte des Business Objects aktivieren (1) oder deaktivieren (0).

  Weitere Parameter sind verfügbar, die basierend auf der FilePond-Dokumentation unter https://pqina.nl/filepond/docs/print-version/#toc im Abschnitt "Eigenschaften" konfiguriert werden können. Um zusätzliche Parameter/Eigenschaften hinzuzufügen, müssen Sie die Datei "binder.js" im Widget direkt bearbeiten. Bitte beachten Sie, dass zusätzliche hinzugefügte Parameter/Eigenschaften möglicherweise nicht wie erwartet funktionieren und nur die oben genannten Parameter getestet wurden.

Konfiguration

Damit das Multi File Upload Widget korrekt funktioniert, benötigen wir 2 separate Tabellen. Eine für die Dateien, die gespeichert werden sollen, in unserem Beispiel ist dies die "Datei"-Tabelle, und eine andere, die Ihre Datei-Uploads mit anderen Daten basierend auf dem Anwendungsfall Ihrer Anwendung verknüpft, in unserem Beispiel ist dies die "Ticket"-Tabelle.

Definition der Ticket-Tabelle

Definition der Datei-Tabelle

Jetzt, da unsere Tabellen eingerichtet sind, können wir zur Konfiguration der Geschäftsregeln übergehen. Wir benötigen mindestens 3 Geschäftsregeln, 2 Geschäftsobjekte und 1 CRUD-Regel, um eine Datei in die Datei-Tabelle einzufügen.

Ticket (Quelle)

Das erste Geschäftsobjekt ist einfach ein Quellobjekt für die Ticket-Tabelle. Dies ist das Geschäftsobjekt, das wir in unserem ersten Panel verwenden werden, an das unser Panel mit dem Widget gebunden wird und uns ermöglicht, eine Datei mit einem bestimmten Datensatz zu verknüpfen:

Ticket (Datei)

Unser zweites Geschäftsobjekt zielt auf die gleiche Ticket-Tabelle ab, enthält jedoch nur die PK (TicketID), Datei und Dateiname (optional). Dies ist wichtig, da wir ein separates Geschäftsobjekt für das Widget benötigen, damit mehrere Dateien parallel hochgeladen werden können:

Ticket (Einfügen in Datei)

Unsere letzte Geschäftsregel ist eine Insert CRUD-Regel, die einen neuen Datensatz in die Datei-Tabelle einfügt. Wir zielen auf die Datei-Tabelle ab und geben ein NewUUID() für die FileID-Spalte an. Diese CRUD-Regel wird im nächsten Schritt dem Speicherevent unseres vorherigen Geschäftsobjekts hinzugefügt:

Wir verknüpfen nun die Ticket (Einfügen in Datei) CRUD-Regel mit dem Speicherevent unseres zweiten Geschäftsobjekts Ticket (Datei) und fügen eine Bindung an TicketID hinzu, wie unten gezeigt. Dies wird jede Datei in die Datei-Tabelle verschieben, sobald der Upload abgeschlossen ist. Da unsere Ticket-Tabelle nur eine einzelne Binärdatei-Spalte hat, ermöglicht diese Konfiguration, dass eine dynamische Anzahl von Dateien mit einem einzelnen Ticket-Datensatz verknüpft werden kann:

Jetzt können wir zur UI-Schicht übergehen, um das Widget selbst einzurichten. Unsere Seite wird aus 2 Panels bestehen. Eines verwendet Ticket (Quelle) und das andere verwendet Ticket (Datei):

Das Panel, das Ticket (Quelle) verwendet, hat weniger Einschränkungen bei der Konfiguration, solange unser nächstes Panel daran gebunden ist. So sieht unseres aus:

Unser nächstes Panel, das Ticket (Datei) verwendet, hat eine einzelne Dateisteuerung, bei der wir das Widget konfigurieren werden:

Unter Kosmetik > Widget-Informationen wählen Sie das MultiFileUpload-Widget aus. Wenn Sie eines der Standardparameter ändern möchten, können Sie dies tun, indem Sie auf die 3 Kästchen unter den Parametern klicken:

Hier sehen Sie, dass wir maxParallelUploads auf 25 geändert haben. Obwohl runSave weiterhin 1 ist, zeigen wir es hier, um seine Bedeutung für die Funktionalität dieses Widgets zu verdeutlichen. Da unsere CRUD-Regel, die unsere Datei in die Dateitabelle verschiebt, beim Speichern-Ereignis von Ticket (Datei) konfiguriert ist, müssen wir sicherstellen, dass dies auf 1 gesetzt ist, um ordnungsgemäß zu funktionieren. Wenn runSave nicht auf 1 gesetzt ist, können wir keine mehreren Dateien verarbeiten.

Wenn Sie weitere Verarbeitungen/Aktionen an einer Datei durchführen müssen, sollte dies beim Einfügen-Ereignis für die Dateitabelle erfolgen. Dazu gehört das Verschieben der Datei in ein lokales oder Netzwerk-Dateisystem.

Video-Beispiel zur Widget-Implementierung