Upload FIles to a Database Collection

[Mike6979865]

I read this tutorial: http://devcenter.appery.io/tutorials/...

So, here's my question:
Users will sign up, fill out an application, upload files, and click submit. The tutorial shows how to store the files in the Files Collection. However, I created a new collection in where it stores the information collection during the application process.

Now, if the files are stored in the files collection, how can i associate the files uploaded with the application that was filled out? I will create a separate admin application that will display all applications received. I'm very familiar with Appery now, but I'm not familiar with the file service yet.

Regards,

[Mike6979865]

So, I followed the tutorial.
So, I made users sign up, and then I saved the session token in local storage variable. I created an input box exactly as indicated in tutorial. I didn't have the users log in. I just saved the user session token, and on page success, I went to the upload page. Now, on button click I ran this javascript code: uploadMultipleFilesHelper(uploadService, Apperyio('file_input'));

However, nothing happens when I click the upload button. I checked the debugger, and it's giving me this error: TypeError Illegal invocation

[Yurii Orishchuk]

Hi Mike,

Unfortunatly that's a bug. We working on it.

But here is a quick workauround for you:

1 Create JS asset:.

2 Populate it with following code:

pre

function uploadMultipleFilesHelperNew(datasource, fileList) {
var isCorrectService = false;
if (datasource) {
if (datasource.service && datasource.service.requestOptions) {
var options = datasource.service.requestOptions;
isCorrectService = options.type === 'post' && options.contentType === false && /^.*\/files$/i.test(options.url);
}
}
if (isCorrectService) {
if (fileList) {
var data = new FormData();
for (var i = 0; i < fileList&#46;length; i++) {
appendItem(data, fileList);
}
try {
datasource&#46;execute({
'allowDataModification': false,
'processData': false,
'body': {data: data},
'cache': false
});
} catch (exception) {
console&#46;log(exception&#46;name + ' ' + exception&#46;message);
hideSpinner();
}
}
} else {
console&#46;warn('This data source not be supported in the method of upload multiple files');
}

Code: Select all

 function appendItem(formData, item) { 
     if (item) { 
         if (item.type === 'file') { 
             item = item.files; 
         } 
         if (item instanceof FileList) { 
             for (var i = 0; i < item&#46;length; i++) { 
                 appendItem(formData, item[i]); 
             } 
             return; 
         } 
         var name; 
         if (item&#46;name) { 
             name = item&#46;name; 
         } 
         formData&#46;append(name, item); 
     } 
 } 

}

/pre

1. Ok, now you can use "uploadMultipleFilesHelperNew" instead of "uploadMultipleFilesHelper".

   so you can invoke upload with following code:

   pre

   uploadMultipleFilesHelperNew(uploadService, Apperyio('file_input'));

   /pre

   Regards.

[Mike6979865]

I was able to upload txt files, but not PDF files. Is there a reason why? Also, how do I determine which file belongs to which user? I need later on to display or list all the files associated with a user along with the information that they submitted when they filled out the form.

Regards,

[Mike6979865]

The PDF file gets uploaded, however, when the pdf name is too long, it doesn't show in the database. Is there a solution to this? I still get an alert that the pdf file was uploaded, however, if doesn't show in the database when the file name is too long.

Also, how do I determine which file belongs to which user? I need later on to display or list all the files associated with a user along with the information that they submitted when they filled out the form.

[Mike6979865]

I managed to list the files for a particular use based on acl. Now, how do I download the files. I created a Rest Service, and on button click I saved the file name in local storage variable. https://api.appery.io/rest/1/db/files...) and I passed the filename, and token, db id. Nothing happens when I click the button to execute the service. I want to be able to download the file from the App.

[Yurii Orishchuk]

Hi Mike,

You can download the file with link component(user click needed). And set "URL" property = url to file.

Also you can use following JS code:

pre

&#47;&#47;Where "fileUrl" is url to file&#46;
window&#46;open("fileUrl", "_system");

/pre

Regards.

[Mike6979865]

Thank you,
I was able to download the file from the database, and display all the files for a particular user in a list. However, I need to display at the same the user information from another collection. For example, I need to display address, last name, email, property type, and as well as the files the user uploaded when filling out an application form. What is the best way to do that?

[Mike6979865]

Also, is it possible to have the file url saved in one of the collection that I created after the upload? I'm thinking I can display the information along with link to the files.
On success, I tried:
success: function(data) {
// OPTIONAL, this is the file name under which the image was stored in database....
localStorage.setData('db_file_url', data.fileurl);
},
but it's not working.

[Yurii Orishchuk]

Hi Mike,

It seems you need to use two separate services.

1. Query files

2. Query user details.http://devcenter.appery.io/documentat...

   Also your code is not correct, there is not "setData" function in localStorage. Use "setItem" instead. Correct code is below:

   pre

   localStorage&#46;setItem('db_file_url', data&#46;fileurl);

   /pre

   Regards.