Forums

Message while uploading the attached files

aristide 01 May, 2009
I would like to tell the one who has submitted a form a wait until he receives the greeting message. That is to say, a meessage all time long, when the files are uploaded.

I added a message in the "box" On Submit code - before sending email:(PHP code with tags)
and also a message in the "box" On Submit code - after sending email:


I get is the two messages at the same time, at the end of the time necessary to upload the files.
This is not what I expected. I would like a message when the hourglass (sandbox?) is running while uploading files.

JOOMLA 1.5.7 Chronoform V3.0 stable


Is this possible ? How to do it ?

Thank you in advance for the help.
nml375 01 May, 2009
The onSubmit code won't be executed until the upload is completed, since web servers will not invoke the underlying cgi application (php in this case) until the request is completed (file uploaded).

What you can do, however, is to use the on Submit javascript event to render your "waiting message" in the client. Once the request is completed, the new page will be returned and displayed by the client - thus removing that message.

One approach for this would probably be to add one div element with the visibility property set to hidden and having a known id. It should contain the "Please wait" message. The onSubmit code would then alter the visibility property to make it visible, hence showing the message. Mootools (comes with CF) might come in handy for this.

/Fredrik
aristide 06 May, 2009
Hello Fredrik,

Thank you very munch for you help; I was waiting for an email telling me an answer has been posted, but I received nothing.


I know very very few about javscript. I can understand what the onSubmit will do. But what will I have to write ? Do you know any source for me to learn, or could you tell me a bit more.

Thank you in advance.
nml375 06 May, 2009
This will be a very rough example, so please bare with me :p

First, in your form code, add some div element with an unique id. It should contain your "Please wait" message with any formatting you'd like:
...
<div id="pleasewait" style="visibility: hidden;">Please wait while the upload is being processed...</div>
...

Next, in the General setup, there's the Form tag attachment; add this:
onSubmit="$('pleasewait').setStyle('visibility', 'visible');"

This uses mootools to alter the visibility property of the "pleasewait" div element, to make it visible. Once the upload completes, a new page is rendered so we don't have to bother with hiding the element again.

You could probably extend this with various libraries such as leightbox, but I hope this at least gets you started.

/Fredrik
aristide 06 May, 2009
Thank you very munch Fredrik, this is exactly what I needed.🙂
This topic is locked and no more replies can be posted.