ReactFilePondUpload

Stable Version 1.0.2 (OutSystems 11)
Published on 1 Jan by 
Created on 21 December 2019
Details
A react file upload widget that allows multiple file upload, automatic upload, drag/drop, image preview, asynchronous upload and image editing that works on all browsers. It uses the awesome FilePond javascript library. https://pqina.nl/filepond/ by Rik Schennink.
Read More

A file upload widget using the awesome FilePond javascript library https://pqina.nl/filepond/ by Rik Schennink

Features

  • Multiple file upload
  • Asynchronous file upload
  • Instant or click to upload
  • Automatic file upload (no submit button required)
  • Disable submit button while files are uploading
  • Select file via browse or drag/drop
  • Image preview
  • Image editing (purchase of Doka image editing library required)
  • Restrict to specific MIME types
  • Maximum file size
  • Maximum number of uploaded files


Usage (with submit button)

  • Place an UploadBlock in a form,
  • Configure the block with a FilePondUploadConfig structure,
  • Each uploaded file is allocated a token which can be used to retrieve the file,
  • On the client side, when the submit button is clicked, get file tokens with FilePondUpload_GetTokens(). Pass these tokens to a server function to retrieve uploaded files. Then clear the upload control with client action FilePondUpload_Reset(),
  • On the server side, pass the tokens to server action FilePondUpload_GetUploadedFiles(UploadTokens) to retrieve the uploaded files.
  • Uploaded files last for 30 minutes, or until they are retrieved by FilePondUpload_GetUploadedFiles().


Usage (automatic, no submit button required)

  • Place an AutoUploadBlock in a form,
  • Configure the block with a FilePondUploadConfig structure,
  • Each uploaded file is allocated a token which can be used to retrieve the file,
  • On the client side, handle the Uploaded event, passing the Tokens parameter to a server action to process files,
  • On the server side, pass the tokens to server action FilePondUpload_GetUploadedFiles(UploadTokens) to retrieve the uploaded files.
  • Uploaded files last for 30 minutes, or until they are retrieved by FilePondUpload_GetUploadedFiles().


See the FilePondUpload_Sample for examples of how to use the widgets.

See Documentation for how to include Doka files for image editing.

What’s new (1.0.2)

Added the AutoUploadBlock for automatically uploading files without requiring the user to click a separate submit button.

Reviews (0)
Category
UI & Widgets
Support Options
This component is not supported by OutSystems. You may use the discussion forums to leave suggestions or obtain best-effort support from the community, including from Stuart Harris who created this component.
Dependencies
ReactFilePondUpload has no dependencies.
Requirements
Platform:
11.0.606.0
Database:
All
Stack:
.NET
Component Consumers
No consumers yet.
Weekly Downloads