Forums

Greetings all.

This post is not about a problem 'per se' but more about finding a better way or a new way ( or add to the current way) to handle the file uploading experience.

If you put a box asking for a file , the form user will click the browse, select the file, hit submit and it goes. All is well.
But if you use several boxes and the user is trying to send big files and further more, understands very little about computers then things start to fail.

I'm facing a similar problem. I have a form asking the user for many documents. These documents are often id cards, CV's and others and many people, actually most of them, don't know very well how to get them from paper to the computer and when they accomplish this, then they end up with huge files when they could easily convert them to a 100kb jpg before sending.

Right now, the component has no upload bar. There were posts about that in the padt, there are complications with moo tools, etc, preventing a solution to be reached. That would solve many things because if the user is able to see a little bar growing in % then he would know the thing is working but more often than not, after waiting 1 or 2 minutes people hit refreshes and cancels all over because they don't know better. Even if they don't browsers often are poorly configured and after a long wait they cancel the thing.
Many things can indeed go wrong with uploading 10mbytes over a 300kbits up connection. My message telling users the sending can take a very long while does little to mitigate the situation.

Another way to go would be to find a way to, on the clients side, get him to reduce his files either by compressing a bmp or zipping. Some java solution of sorts?

Right now I get about 20%-30% of situations where people are unable to send a form because of file uploads.

This isn't the components fault, it is working as intended. My post is more about picking your brains for a solution to a problem like this. I'm sure experience has taught you ways to overcome such problems?

Anyhoo, if you have an opinion, plz do share.
I thank you for your time.
Cheers.
Mori

Hi Mori,

You may add a JS code to the submit button of your form to hide the fields when its clicked and display a message in red color to tell the user that the page is working in background, don't hit refresh!

Regards,
Max

Just a thought, couldn't the new extra code in recent CF be used with Ajax-based background uploads to avoid timeouts?
Might need a few tweaks regarding the builtin file upload handler in CF, but shouldn't seem that infeasible? Thoughts would be to let the Ajax-handler store some session data pointing to the recently uploaded file, and then have the "on submit" code retrieve that and add it to the $_FILES array to let CF "see and handle" the upload as usual..

/Fredrik

Just a thought, couldn't the new extra code in recent CF be used with Ajax-based background uploads to avoid timeouts?
Might need a few tweaks regarding the builtin file upload handler in CF, but shouldn't seem that infeasible? Thoughts would be to let the Ajax-handler store some session data pointing to the recently uploaded file, and then have the "on submit" code retrieve that and add it to the $_FILES array to let CF "see and handle" the upload as usual..

/Fredrik

Hi Fredrik,

Thanks for the suggestion but let me make sure we are on the same page, Mori said that the main problem is the delay in form submission because of the different files uploaded, how do we get a reference to the uploaded file(s) if they are not yet uploaded ? and if they are uploaded then we already didn't meet the target we need because we will spend the uploading time too!?

and yes, the Extra boxes is supposed to make AJAX easier!

Regards,
Max

The basic idea, is something like using file attachments with GMail. You use a separate connection (ajax) for each uploaded file, and thus spread the upload time across multiple slots, rather than upload say 5 large documents in one form submission. This would not solve issues with one single, huge file, but it should help with several moderate size files within the same form.

Also, since the file upload is not done "within" the form window (but most likely through a hidden IFrame), should the file upload fail, the rest of the entered form data would still be around for the user to try again. It would probably be a wise idea to block form submission while an upload is in progress, or at least warn the user of this.

As for the technical part, the ajax-handler would have to store information on the uploaded file in some storage common to the form submission. I'm thinking session data, as this would be unique to the user but remain the same through the ajax calls and the form submission. The form submit code would then have to retrieve this information, and add it to the submitted data (possibly adding the data to the $_FILES[] array prior CF file management, I believe this would have to be done within the server validation code).

/Fredrik

Hi Fredrik,

Thanks, I will look into this implementation and see whats possible!

Regards,
Max

Decided to play a little with this myself.
Actually, I got it working mostly. The current problem is that JFile::upload() makes use of the move_uploaded_file() php function. This, unfortunately, isn't that easy to fool as to merely append data to the $_FILES array.

This could probably be worked around, although you'd have to manually copy the file to the proper location, do any needed sql-queries for db-storage, and manually attach the document to any emails to be sent.

/Fredrik

Hi Fredrik,

I didn't have enough time to play with it myself, but when I do I will let you know what I find!🙂

Regards,
Max

I wish I could help you guys figure this out but I don't know enough about the matter.
Just to mention and answer the first post by Max, I did put a message onsubmit so that it at least tells the user to wait but when they don't know what's going on they only wait for so long.

The ideas you were shooting around sounded really nice. Gmail seems to have it right with the upload bars and different processes. I've never seen a joomla forms component do something like that. This would be something really unique.

Good luck with your investigations, the entire community will appreciate it.

Thanks.
Mori

Hi Moriwenne,

Joomla has quite nice file uploader bars. Unfortunately there was a problem with the MooTools 1.1 library and one of the Flash releases - v 9.0 maybe. And they stopped working. There are workarounds and new versions out there now but I dont know if there is a fix for MooTools 1.1 which is the version built in to Joomla.

Bob

I did come across a rather neat progress-bar solution for php+perl the other day. Unfortunately, since it makes use of a perl-based uploader, it's not that portable (and I managed to loose the url).

As for pure-php upload+progress, your best bet would be to have your host admin install the APC extension, and make use of apc.rfc1867 (http://www.php.net/manual/en/apc.configuration.php#ini.apc.rfc1867 Example at: http://www.johnboy.com/about-us/news/a-useful-php-file-upload-progress-meter).

Can't say much about Joomla's flash bars, as I've never used them myself.

Edit: Managed to find the link for the perl-based uploader. It is known as LightLoader, and may be downloaded from http://www.seemysites.net/projFolder/uploader/. Assuming your host permits perl-scripts, this shouldn't be too hard to Joomla-ize (with the exception of the perl script obviously).

/Fredrik

Hi nml375.

I've checked those links. That seems like a viable solution. I don't think I know how to link it with chrono forms. Could the two be used together? Is this a solution?

Thanks
Mori

If your hosting server do support apache APC, that would work perfectly with joomla. Such a solution would consist of a few parts:
[list]

The form itself. Needs to have a hidden field named APC_UPLOAD_PROGRESS, it's value should be a unique key for this form. This field also must appear above/before any file inputs within the form.

Javascript. Should be loaded with the form, and has the responsibility of doing Ajax calls to get the current upload progress. Most basic versions would simply use setTimeout() to refresh the progress during the upload. There are some JS-libraries with more flexible and powerful solutions.

ServerSide script. This would be stored in one of the extra-boxes of more recent chronoforms. It has the responsibility to retrieve the upload progress through the APC interface, and thus needs to know the unique identifier mentioned above. It should then provide the upload data to the javascript running in the form.

[/list]

I believe the 1.1 MooTools do provide most javascript features needed for this, and the php/APC part should be trivial enough. It would be a good idea to verify that APC is indeed available, as it requires php5.2 or newer, and is not part of the standard installation.

/Fredrik