• 1

Read this first!

We do not monitor these forums. The forum is provided to exchange information and experience with other users ONLY. Forum responses are not guaranteed.

However, please submit a ticket if you have an active subscription and wish to receive support. Our ticketing system is the only way of getting in touch with RSJoomla! and receiving the official RSJoomla! Customer Support.

For more information, the Support Policy is located here.

Thank you!

TOPIC: Progress Bar?

Re:Progress Bar? 14 years 2 months ago #12717

  • xingu
  • xingu's Avatar
  • OFFLINE
  • Junior Boarder
  • Posts: 32
  • Thank you received: 1
Upon investigating this issue with IE, I have found the problem. Once again IE sucks. I found this.
IE assumes that the clicking of a link heralds a new navigation where the current page contents will be replaced. As part of the process for perparing for that it halts the code that animates the GIFs. I doubt there is anything you can do about it (unless you aren't actually navigating in which case use return false in the onclick event).

There were 2 solutions, but as I am not a coder I don't understand how to implement this. Could someone help. This is one of the few things I wish was included in the form component.

1.
The accepted solution did not work for me.
After some more research I came across this workaround, and it actually does work.
Here is the gist of it:
<script>
function showProgress() {
var pb = document.getElementById("progressBar");
pb.innerHTML = '<img src="./progress-bar.gif" width="200" height ="40"/>';
pb.style.display = '';
}
</script>

and in your html:
<input type="submit" value="Submit" onclick="showProgress()" />
<div id="progressBar" style="display: none;"><img src="./progress-bar.gif" width="200" height ="40"/></div>

So when the form is submitted the img tag is inserted which for some reason it is not effected by the ie animation issues.
Tested in Firefox, ie6, ie7 and ie8.

2.
IE assumes that the clicking of a link heralds a new navigation where the current page contents will be replaced. As part of the process for perparing for that it halts the code that animates the GIFs. I doubt there is anything you can do about it (unless you aren't actually navigating in which case use return false in the onclick event).
I tried the solution given by AnthonyWJones above by adding -

return false;

at the end of the script in the clicked link and it worked. Thanks!
The administrator has disabled public write access.

Re:Progress Bar? 13 years 8 months ago #14432

Works perfectly, thank you.
The administrator has disabled public write access.

Re:Progress Bar? 12 years 11 months ago #17406

  • rizalito
  • rizalito's Avatar
  • OFFLINE
  • Fresh Boarder
  • Posts: 1
HI, I tried using the proposed solution but I could not get it to work. Any tips?
The administrator has disabled public write access.

Re: Progress Bar? 12 years 11 months ago #17631

  • milosmilcom
  • milosmilcom's Avatar
  • OFFLINE
  • Fresh Boarder
  • Posts: 4
  • Thank you received: 1
As I'm using ajax validation, think that didn't exist when this topic started, this solution was partially helpful.
The problem is that the loading gif appears onsubmit (click) even if the form didn't validated and files didn't start uploading…

As I'm using jQuery, this example is done with jQuery and one page form. Will make some tests for multi-page forms or if somebody get how to obtain the variable, please post it.
EDIT: Multipage variable added

Add a Free Text field, and put this code inside:
<div id="loading" style="display: none;">
	Please wait, we are uploading the files <br /> 
	<img src="[CHANGE_THIS_TO_YOUR_PATH]/ajax-loader.gif" alt="" />
</div>
 
<script type="text/javascript">
/* <![CDATA[ */
jQuery(document).ready(function() {
 
	var formId 	= jQuery('form input[name="form[formId]"]').val(),
		form 	= rsfp_getForm(formId),
		page 	= '{page}';
 
	jQuery('#Submit').click( function () {
		var Valid = ajaxValidation(form, page);
		if (Valid) { 
			jQuery('#loading').css('display','block');
		}
	});
});
/* ]]> */
</script>

You can make your own loading gif and change style params for it, however, you need one gif for this example, use the link provided in the first answer.

Hope not missing something....
Last Edit: 12 years 11 months ago by milosmilcom.
The administrator has disabled public write access.
The following user(s) said Thank You: beth.ray

Re: Progress Bar? 12 years 7 months ago #19213

  • xingu
  • xingu's Avatar
  • OFFLINE
  • Junior Boarder
  • Posts: 32
  • Thank you received: 1
Still not working in IE

Anyone have a html5 solution or something??
The administrator has disabled public write access.

Re:Progress Bar? 12 years 5 months ago #20207

  • innoslov
  • innoslov's Avatar
  • OFFLINE
  • Fresh Boarder
  • Posts: 1
Hello Ocatvian, am having aproblem implemeting Ajax Loading gif when form is submited in my joomla form pls can u assist me to accomplish the... Just another Joomla beginner. Thanx in Advance.
The administrator has disabled public write access.

Progress Bar? 12 years 2 months ago #21871

  • xingu
  • xingu's Avatar
  • OFFLINE
  • Junior Boarder
  • Posts: 32
  • Thank you received: 1
Yes this would be very helpful. It seems no matter what directions I give people on waiting until the page refreshes and that tells you the uploads are complete they still think nothing is happening and give up or keep pressing the submit button.

I also don't get why they don't just give us the solution they use in the RSFiles uploader. Doesn't that have an upload progress indicator?
The administrator has disabled public write access.

Progress Bar? 11 years 7 months ago #24898

  • geral82
  • geral82's Avatar
  • OFFLINE
  • Fresh Boarder
  • Posts: 5
Thanks for all your information that benefit me.

I was having the problem mentioned by milosmilcom that the message was showing even before validation.

To solve this i did the following:

Instead of using a javascript function, i add this:

document.getElementById('loading').style.display = 'block';

in components/com_rsform/assets/js/script.js, after ajaxvalidation is true on line 182.

It will show like this aftwards:
	if (success == true) {
		try {
			document.getElementById('rsform_error_' + formId).style.display = 'none';
			document.getElementById('loading').style.display = 'block';
		}

This solved my ajax validation problem!
The administrator has disabled public write access.

Progress Bar? 11 years 6 months ago #25277

I still cannot get this to work. I have tried everything listed above... :(

Can someone please put a step-by-step guide as to how they got this working?

When the user clicks Submit, I want an animated gif that says "Processing your request." When the form is fully uploaded, it will bring them to a page that says "Thank you for your submission. An agent will be contacting you shortly." Right now, when the user clicks submit, the page just refreshes for a long period of time...which could be a problem for impatient users...

Thanks ahead of time.
The administrator has disabled public write access.

Progress Bar? 11 years 5 months ago #25652

  • grafik7
  • grafik7's Avatar
  • OFFLINE
  • Fresh Boarder
  • Posts: 1
Yes, it would be great if you could add a short step by step manual for implementing a progress bar.

I know that your rivals Bree... Forms have a progress bar implemented, but I want to stay with RS Joomla, because I'm very happy with the components and the support.

Thank you!
Fabrizio
The administrator has disabled public write access.

Re:Progress Bar? 11 years 1 day ago #27479

  • beth.ray
  • beth.ray's Avatar
  • OFFLINE
  • Fresh Boarder
  • Posts: 4
can't get either to work in Safari 7.0.3

the first one worked bury only if I stop the upload - if I hit the x in the browser url bar, I see it, but not when the file is actually uploading.

the second option gives no indication of where to add the scripts, but after several tries in different locations, it still doesn't work
The administrator has disabled public write access.

Re: Progress Bar? 11 years 1 day ago #27480

  • beth.ray
  • beth.ray's Avatar
  • OFFLINE
  • Fresh Boarder
  • Posts: 4
the message appears, but the animation doesn't....animate. It's static (Safari 7, mac)
The administrator has disabled public write access.

Re:Progress Bar? 8 years 8 months ago #35726

octavian wrote:
Hello,

Try the following:
- Put the loading "gif" image (You can use: www.ajaxload.info/ to generate your own animated image, I find it pretty useful) in a FreeText component. Use the following HTML code in the "Text" field:
<div id="loading" style="display: none">Please wait, we are processing your request <img src="path/to/your.gif" alt="" /></div>


- Add another FreeText component for the Javascript:
<script type="text/javascript">
function display_loading()
{
document.getElementById('loading').style.display = 'block';
}
</script>

- Finally, move to the Scripts section, and add this code to the "Script called on form display" area:
$formLayout = str_replace('<form method="post"','<form method="post" onsubmit="display_loading();"',$formLayout);

Let me know how this turns out :)

Hello octavian!
your code works but does not work if you have enabled ajax validation
Can you help?
The administrator has disabled public write access.

Re:Progress Bar? 8 years 1 month ago #36615

  • lukasm
  • lukasm's Avatar
  • OFFLINE
  • Fresh Boarder
  • Posts: 1
I have the same problem.
Is it possible to show the percentage of downloads?
Last Edit: 8 years 1 month ago by lukasm.
The administrator has disabled public write access.

Re:Progress Bar? 3 years 8 months ago #41495

  • modernmagic
  • modernmagic's Avatar
  • OFFLINE
  • Junior Boarder
  • Posts: 33
  • Thank you received: 2
octavian wrote:
Let me know how this turns out :)

I tried this with RSForm! Pro 3.0.10 but the gif does not show.
Warning: Spoiler! [ Click to expand ]


I can see the code and gif in the source code but it stays hidden with display:none.
Last Edit: 3 years 8 months ago by modernmagic.
The administrator has disabled public write access.

Re:Progress Bar? 3 years 5 months ago #41687

  • modernmagic
  • modernmagic's Avatar
  • OFFLINE
  • Junior Boarder
  • Posts: 33
  • Thank you received: 2
deleted
Last Edit: 3 years 5 months ago by modernmagic.
The administrator has disabled public write access.
  • 1

Read this first!

We do not monitor these forums. The forum is provided to exchange information and experience with other users ONLY. Forum responses are not guaranteed.

However, please submit a ticket if you have an active subscription and wish to receive support. Our ticketing system is the only way of getting in touch with RSJoomla! and receiving the official RSJoomla! Customer Support.

For more information, the Support Policy is located here.

Thank you!