How to add the upload file widget to the configurable form

1. Ensure that a new attachment type is configured in the uploader

The existing attachment-upload type used in the data collection form (present in the /default portal) is not generic enough to be used by other forms. To allow a widget to be used more flexibly, a new upload type and rules file called "attachment-file" was created. To your system configuration alongside the existing attachment-config (under the uploader key, uploader.json) configuration add:

"attachment-file": {

"screen-label": "Attachment",

"security": [

"librarian",

"reviewer",

"researcher",

"admin"

],

"upload-path": "${fascinator.home}/uploads/attachments",

"json-config": "${fascinator.home}/harvest/workflows/attachment-file.json"

},

2. Configure your form to use the attachment-file and file-upload-table widgets

The upload file widget is actually split into two widgets so that it's layout is flexibile:

    1. attachment-file: This is the widget that allows the user to select a file from the file system and upload it to the system

    2. file-upload-table: This widget provides a table that shows the existing files that are attached to the record.

In your form configuration json add the following:

{

"component-type": "file-attachments",

"widgetname": "<widget_name>",

"attachType": "<attachment_name>",

"accessRights": "public",

"enableDescription": "true",

"addFunction": "add<upload_model>Row"

},

{

"component-type": "file-upload-table",

"metadataPrefix": "<uploadMetadataPrefix>",

"modelName": "<upload_model>",

"tableName": " <upload_table>",

"initialiseFunctionName": "<widget_name>_getUploadedFiles",

"removeFunction": "<widget_name>_deleteFile"

}

Where:

  • widget_name is a unique name to identify this widget

  • attachment_name is a unique name to identify the attachment type

  • upload_model is a unique name to used to build the model (the table is rendered using KnockoutJS and the model is the MVC model)

  • upload_table is a unique name to identify the table.

A working configuration example:

{

"component-type": "file-attachments",

"widgetname": "storage_attachment",

"attachType": "storage-attachments",

"accessRights": "public",

"enableDescription": "true",

"addFunction": "addfileUploadModelRow"

},

{

"component-type": "file-upload-table",

"metadataPrefix": "storageFileUpload",

"modelName": "fileUploadModel",

"tableName": " fileUploadTable",

"initialiseFunctionName": "storage_attachment_getUploadedFiles",

"removeFunction": "storage_attachment_deleteFile"

}

Result

Once the configuration is complete, the form should render the file upload widget and the should be able to upload and remove files from a record