Fine Uploader provides methods and options to enable client-side editing
of filenames before upload. In core mode, integrators can use the API methods
this. In UI mode, if the feature is enabled via the template, then when a user
clicks a file that they have submitted to the uploader the text will become
an input element that they can use to change the name.
You will need to have the
autoUpload option disabled when using the edit filename feature.
In order to enable this feature, you must disabled
autoUpload and include the following elements in your template:
<span class="qq-edit-filename-icon-selector qq-edit-filename-icon" aria-label="Edit filename"></span> <input class="qq-edit-filename-selector qq-edit-filename" tabindex="0" type="text">
When this feature is properly enabled, you will notice an edit icon next to each submitted file in the UI, assuming the
filename is editable at the time. Also, notice the cursor will be set to “pointer” in this case. A filename is editable
only while the upload status is SUBMITTED. This means that you may edit your file after submitting it, before calling the
uploadStoredFiles API method.
When an editable file name is clicked/touched, a text input will appear. Here, the filename can be changed. Note that the extension is not modifiable. The original extension will always be appended to the filename after the name edit is complete. The extension is not editable to ensure that any validation rules surrounding file type are not violated.
After editing a filename, you have a few options:
Note that an empty file name is not an acceptable value. In this case, the original or previously overridden file name will be used instead.
When a file name has been modified, please keep the following in mind:
getUploadsAPI method can be used to obtain the original file name. All objects returned by this method will include an
originalNameproperty. The name property will be set to the current file name.
getNameAPI method will return the current file name, not the original file name.
The filename will be sent with the request as the
qqfilename parameter. Be sure to read this parameter when naming
your file server-side.