How to rename a file before uploading to Files collection to avoid error DBFM151 (invalid file name) when file name cont

[Jon Haider]

Hey guys,

I have noticed that I get error DBFM151 whenever I try to use:
codeuploadMultipleFilesHelper(uploadService, Apperyio('imageInput'));/code
if the file that I am trying to upload contains a space in its name. In other words, if I have an image on my desktop with file-name "my picture.jpg", and I try to upload it to the files collection, the upload service will return this error:

pre
[{"error":{"code":"DBFM151","description":"Invalid file name was used. A valid file name contains only a-zA-Z0-9%_.- characters and is between 1 and 218 characters."}}]
/pre

In order to avoid this in the future, is there a way to validate the filename PRIOR to running the "uploadMultipleFilesHelper" function, and renaming the file-name if it contains spaces?
Maybe something that checks if the filename contains spaces, and if so, replace them with an underscore to make the new filename "my_picture.jpg"?

Any help is appreciated, thank you!

[Illya Stepanov]

Hi Jon -

We aware of this, but this is a jQuery and AngularJS bug. You will need to encode space into "%20" something like this:
pre
code"some text".replace(/ /g, "%20");/code
/pre

[Jon Haider]

That's exactly what I thought, but how is that implemented?
I am looking for directions on how to rename the file before uploading (either replace space with an underscore, or replace is with "%20").

In other words, what code would you use to determine the filename, and rename it? To determine the filename, I am currently using the following code on on the file-input value change:
pre
var str = Appery('input_element').val();
var n = str.lastIndexOf('\\');
var result = str.substring(n + 1);
if(result.indexOf(" ")=0){
//filename contains space
//rename file here and then upload
} else{
//proceed with uploading the image normally
}
/pre

How would the filename be changed before calling the uploadMultipleFilesHelper function?

I've noticed from here and here that you cannot rename the file on the client side. Is there an appery workaround, or is my only option to display the error to the user and ask them to rename the file (locally) or select another file...?

Thank you Illya!

[Serhii Kulibaba]

Hello,

You can Read a file with FileReader function: https://developer.mozilla.org/en/docs...
and send it's base64 value into uploadMultipleFilesHelper function or send it with jQuery POST request