Skip to content

File Upload Widget

Capabilities

The File Upload Widget enables users to:

  • Upload files from a local device.
  • Import files via external URLs.
  • Select previously uploaded files from a Media Gallery.
  • Drag and drop files into the upload zone.
  • Manage multiple file uploads with progress tracking.

Usage

Enable the file_upload_widget plugin in your CKAN config:

ckan.plugins = ... files file_upload_widget

Then reference the snippet in your scheming schema:

form_snippet: files_upload_widget.html

Warning

You need to implement the API actions uploadAction and uploadLinkAction to make the widget work properly. By default, it uses the default and link storages and does not include proper auth checks.

Read about why separate API actions are required in the permissions section.

Options

The widget supports the following configuration options within the schema field definition.

accept

Defines the file types the file input should accept. This maps to the HTML5 accept attribute.

Example:

- field_name: image
  label: Image
  form_snippet: files_upload_widget.html
  accept: image/*

JavaScript Options (file-upload-widget.js)

You can configure the JavaScript behavior by passing options via form_attrs in the schema. These are converted to data-module-* attributes.

Option Attribute Default Description
maxFiles data-module-max-files 0 Maximum number of files allowed. Set to 0 for unlimited.
disableUrl data-module-disable-url false If true, hides the URL import button and window.
disableMedia data-module-disable-media false If true, hides the Media Gallery button and window.
uploadAction data-module-upload-action file_widget_file_create API action used for uploading local files.
uploadLinkAction data-module-upload-link-action file_widget_link_create API action used for importing files via URL.

Configuration Example:

- field_name: resources
  form_snippet: files_upload_widget.html
  form_attrs:
    data-module-max-files: 5
    data-module-disable-media: true
    data-module-upload-action: my_custom_upload_action