JavaScript Events

When users upload files using filespin.js, it will emit start and complete events detailed below:-

Event	Description
`ready`	Raised when the Picker Dialog is ready and displayed. This event does not supply any data.
`close`	Raised when the Picker Dialog is closed by user. This event does not supply any data.
`start`	Raised when a user has initiated upload of a file. This will not be triggered for Cloud Uploads.
`complete`	Raised when an upload has finished, whether error or success. If upload is successful for a file, a unique Asset ID is returned in id.

📘
For local uploads, complete event indicates FileSpin server has received the file. For Cloud Uploads, complete event indicates FileSpin server has received the upload request.

Listening to Picker Events

To listen for events, use the FileSpin.on API. You can listen to start, complete or all events using the special * event.

//listen to 'start' event
FileSpin.on("start", function (data) {
  console.log(data);
});

//listen to 'complete' event
FileSpin.on("complete", function (data) {
  console.log(data);
});

//listen to all events
FileSpin.on("*", function (data, eventName) {
  console.log(eventName, "triggered with data", data);
});

//Stop listening to 'complete' event
FileSpin.off("complete", myEventHandler);

"start" event - JSON Sample

{
  "provider": "local",
  "files": [
    {
      "name": "sample.pdf",
      "size": 884888
    }
  ]
}

Event data JSON format and samples

Upload events raised provide JSON formatted data. The data format is intentionally simple and the keys are as below:-

Key	Description
`provider`	Source where files were picked from, it is one of the valid provider values
`files`	List of files

Event data samples for start event raised when upload starts and complete event raised when upload completes are shown in the code samples to the right.

Upload failures

When uploads fail, it could be due to any of the following reasons:-

File upload is not authorized for the website
Picker was initialized with incorrect Upload Key
Network or server error

For network or server error, "message" will be set to UPLOAD_FAILED. In both failure cases, "id" is null and "success" is false.

For unauthorized or incorrect upload key, message will be set to UPLOAD_UNAUTHORIZED.

"complete" event - Upload success JSON Sample

{
  "provider": "local",
  "files": [
    {
      "id": "54dcbfbe2b124361a6ff4c62814789c7",
      "name": "sample.pdf",
      "size": 884888,
      "success": true,
      "message": "UPLOAD_SUCCESS"
    }
  ]
}

"complete" event - Upload failed JSON Sample

{
  "provider": "local",
  "files": [
    {
      "id": null,
      "name": "sample.pdf",
      "size": 884888,
      "success": false,
      "message": "UPLOAD_FAILED"
    }
  ]
}

"complete" event - Upload unauthorized JSON Sample

{
  "provider": "local",
  "files": [
    {
      "id": null,
      "name": "sample.pdf",
      "size": 884888,
      "success": false,
      "message": "UPLOAD_UNAUTHORIZED"
    }
  ]
}

📘
If Picker does not open, please check the browser console for any errors.