Basic styles and behaviors for the uploading file function.
Users usually want to attach related materials to their content, such as event, topic, post, wiki or upload files for storage or sharing. To do that, they simply use the Upload function provided by elcom Platform. With this function, you can upload files for changing your avatar, storing or sharing files, importing data.
Template
Default upload popup: Only select one file at once:
When a file is selected, it will be auto-uploaded. The Cancel icon is to abort uploading:
While a file is being uploaded, the Select File button is available to select more files. So, multiple files can be uploaded as below:
Uploading files is successful:
More files can be selected to continue uploading:
Markup
HTML is your standard unordered list with links.
| Status | Description |
|---|---|
| No file is uploaded by default | The Upload popup is displayed with default style. |
| A file is being uploaded | The file name is displayed with a progress bar that shows percentage of uploading. The Cancel button is to stop uploading. |
| A file is uploaded completely | The progress bar is disappeared. The Trash icon is to remove the uploaded file. |
| UP-01 | Upload button or symbol is easy to see. |
| UP-02 | Only one file can be selected at once. |
| UP-03 | Multiple files are being uploaded. |
| UP-04 | The uploading percentage must be matched with the progress bar status. |
| UP-05 | The uploaded files are saved into database only when the Save button is saved. |
| UP-06 | The file title must be cut off with 20 characters and "..." in case of longer title. |
