FileUpload | X4Documentation

Mit <FileUpload>-Controls können Dateien in eine Web-Anwendung hochgeladen werden, die mit X4 Web Apps erstellt wurde. Das <FileUpload>-Control kann nur in Detail Components oder Detail-Strukturelementen innerhalb einer Master/Detail Component verwendet werden.

Das <FileUpload>-Control verwendet den Standarddialog Datei öffnen des Browsers, in dem der Benutzer die Datei auswählen kann, die hochgeladen werden soll. Nachdem der Benutzer die Datei ausgewählt hat, startet der Upload. Der Technical Process, der die hochgeladene Datei entgegennimmt, muss eine Bestätigung oder eine Fehlermeldung zurückgeben. Wenn die Bestätigung eine Nachricht enthält, wird diese Nachricht als Pop-up-Fenster angezeigt. Pop-up-Fenster mit Fehlermeldungen werden in jedem Fall angezeigt.

Hinweis:

Bei Verwendung eines mobilen Endgeräts kann zusätzlich auf die integrierte Kamera zugegriffen werden.

Hinweise zur Verwendung

Ein <FileUpload>-Control wird mit dem Element <FileUpload> erzeugt.

<FileUpload>
...
</FileUpload>

<FileUpload>-Controls können in allen verfügbaren Layouttypen verwendet werden. Weitere Informationen finden Sie unter Layouts.

Attribute

Hinweis:

Es gibt eine Reihe von Standardattributen, die für alle Controls festgelegt werden können. Weitere Informationen zu den Standardattributen finden Sie unter Standardattribute.

Zusätzlich zu den Standardattributen können Sie die folgenden Attribute für <FileUpload>-Controls definieren.

Attribut	Beschreibung
`acceptedFileTypes`	Dateityp, nach dem im Auswahldialog gefiltert wird. Data Binding möglich Dieses Attribut filtert nur nach Dateitypen. Der Filter kann vom Benutzer zurückgesetzt werden, um alle Dateitypen anzuzeigen und auszuwählen. Mögliche Werte: Beliebige Zeichenkette (Dateiendung) Hinweis: Geben Sie für dieses Attribut nur die Dateiendung an, z. B. `pdf`. MIME-Typen und Platzhalter (`*`) sind nicht zulässig.
`autoUpload`	Legt fest, ob der automatische Upload von Dateien aktiviert ist. Data Binding (Boolean) möglich Mögliche Werte: `true`/`false` Ausdruck für Data Binding
`displayName`	Anzeigename in der Oberfläche. Mögliche Werte: Beliebige Zeichenkette
`fileId`	Identifikator, der vom Prozessentwickler verwendet werden kann. Data Binding möglich Mögliche Werte: Beliebige Zeichenkette
`maxSizeMB`	Maximale Dateigröße in Megabyte. Mögliche Werte: Ganzzahl
`multipleFiles`	Legt fest, ob mehrere Dateien hochgeladen werden können. Mögliche Werte: `true`/`false` Hinweis: Der Upload mehrerer Dateien erfolgt mit dem Multipart-Upload-Mechanismus. Dies ermöglicht eine effiziente Handhabung großer Dateien bei einer niedrigeren Serverauslastung.
`process`	Erforderlich Technical Process, der die hochgeladene Datei entgegennimmt. Der Technical Process muss inklusive Dateiendung (`.wrf`) angegeben werden. Mögliche Werte: Zeichenkette (URI)

Input-Format für den Technical Process

Die Daten werden in einem bestimmten Input-Format an den Technical Process übergeben.

XML

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<File>
    <FileId>....</FileId>
    <FileName>....</FileName>
    <FileType>....</FileType>
    <FileData>
    ....Base64 data....
    </FileData>
</File>

Die Daten im Element <FileData> können z. B. mit dem Base64 Converter dekodiert werden.

Beispiele

Hier finden Sie verschiedene Beispiele für <FileUpload>-Controls.

Beispiel 1

FileUpload-Control in der Detail Component

XML

<DetailComponent path="Dashboard" displayName="Dashboard" default="true">
    <FlowLayout>
        <FileUpload displayName="Please select your profile picture..." displayName="Please select your profile picture..." acceptedFileTypes=".png,.jpg,.svg" backgrodxSizeMB="5" process="uploadPicture.wrf"/>
    </FlowLayout>
</DetailComponent>

Beispiel 2

FileUpload-Control in der Detail Component

XML

<DetailComponent
	xmlns="http://softproject.de/webapp/1.0">
	<Actions>
		<UploadAction process="FileUpload.wrf"></UploadAction>
	</Actions>
	<FlowLayout>
		<Header value="Standard" titleLevel="subtitle" />
		<FileUpload process="FileUpload.wrf"
			displayName="Hochladen" />
		<Label value="" />
		<Header value="Mehrere Dateien" titleLevel="subtitle" />
		<FileUpload process="FileUpload.wrf" multipleFiles="true"
			displayName="Hochladen" />
		<Label value="" />
		<Header value="Autoupload mehrere Dateien"
			titleLevel="subtitle" />
		<FileUpload process="FileUpload.wrf" multipleFiles="true"
			autoUpload="true" displayName="Hochladen" />
		<Label value="" />
	</FlowLayout>
</DetailComponent>