A.Paul
A.Paul

Reputation: 31

Uploading of files using sap.m.UploadCollection in Openui5 with a backend servlet doesn't work

I have written a backend servlet to handle the upload of files using the instantUpload feature of sap.m.UploadCollection in Openui5. As I am uploading multiple files to the server, I have chosen the sap.m.UploadCollection instead of the sap.ui.unified.FileUploader. When I try to parse out a list of FileItem instances from the HttpServletRequest in the servlet, it gives me the exception

the request doesn't contain a multipart/form-data or multipart/mixed stream

The ServletFileUpload.isMultipartContent(request) is obviously returning me a false and confirms me that it isn't a multipart/form-data request.

XML Code:

<UploadCollection id="UploadCollection1"
            multiple="true"
            sameFilenameAllowed="true"
            showSeparators="All"
            change="onChangeUploadCollection"
            fileDeleted="onFileDeleted"
            selectionChange="onSelectionChange"
            uploadComplete="onUploadCompleteUploadCollection"
            beforeUploadStarts="onBeforeUploadStarts"
            items="{path : '/record/uploadcollectionitems', templateShareable : 'true'}"
            uploadUrl="{/record/upload}"
            mode="SingleSelectLeft">

            <toolbar>
                <OverflowToolbar id="myId1">
                    <Title id="attachmentTitle1" />
                    <ToolbarSpacer />
                    <Button id="downloadButton1" text="Download" press="onDownloadItem"
                        enabled="false" type="Transparent"></Button>
                </OverflowToolbar>
            </toolbar>
            <items>
                <UploadCollectionItem documentId="{documentId}"
                    fileName="{fileName}" mimeType="{mimeType}" 
                    url="{url}" enableEdit="true" enableDelete="true"
                    visibleDelete="true" visibleEdit="true"
                    statuses="{path : '/record/uploadcollectionitems', templateShareable : 'true'}"
                    selected="false">
                    <statuses>
                        <ObjectStatus title="{Status}" visible="false"
                            state="{state}" icon="{icon}" iconDensityAware="{iconDensityAware}"
                        textDirection="{textDirection}" />
                    </statuses>
                </UploadCollectionItem>
            </items>
</UploadCollection>

The uploadURL in the XML points to the Servlet, which starts executing after the selection of the file is done on the front-end.

If I choose to use the FileUploader instead of the UploadCollection, it successfully encodes the request as a multipart/form-data, but it does not fulfill my requirements.

I have also tried adding content-typeas a HeaderParameter and setting it to multipart/form-data, in order to make the request as a multipart/form-data. Since such a step is not advisable, I have aborted it mid-way.

Since the sap.m.UploadCollection control uses the sap.ui.unified.FileUploader control and contains dependencies to this control, it is confusing as to why the former would not send the HttpServletRequest as a multipart/form-data.

Note: I have not included the corresponding JavaScript code or the Servlet code for brevity purposes. I'll be happy to include them if required.

Upvotes: 3

Views: 3211

Answers (2)

dejantm
dejantm

Reputation: 11

You can use the UploadCollection with multipart. In the controller, you need to have:

onBeforeUploadStarts: function(oEvent) {
var oUploadCollection = this.getView().byId("UploadCollection");
         oUploadCollection = oUploadCollection._getFileUploader();
         oUploadCollection.setUseMultipart(true);
}

Upvotes: 0

matbtt
matbtt

Reputation: 4231

If you take closer look into the code you'll see that the FileUploader used by the UploadCollection is always instantiated with useMultipart set to false. You do not have chance to change that unless you intervene the creation of the FileUploader. I'm not sure why this approach has been taken.

Upvotes: 1

Related Questions