Buy Now
Sign in

Show a GIF on loading the form, and hiding the Submit btn

SPABO , November 29 2018
S
SPABO 637
November 29 2018 #381860
Hi,
How to set up loading a GIF when the form is sending, but at the same time hiding the submit button
I realize we made this work in CFv4, but now I wish to make this work in CFv5
Hope you could help..
healyhatman 5.2
November 29 2018 #381863
Could always just skip v5 and go straight to v6
Web developer at SkySpider.com.au
I don't work for ChronoEngine but I do accept donations paypal.me/healyhatman

You can now copy+paste code from forums
S
SPABO 637
November 29 2018 #381864
Hi,
This is not my preference, pls advise how to set up in V5
Thanks in advance
Rgds
healyhatman 5.2
November 29 2018 #381865
I don't actually know enough about CFv5 to help you I only do v6 Might have to wait for Bob.
Or have a look at the FAQs. https://www.chronoengine.com/faqs/70-chronoforms/cfv5/5256-how-do-i-show-a-loading-image-when-the-form-submits-in-cfv5
Web developer at SkySpider.com.au
I don't work for ChronoEngine but I do accept donations paypal.me/healyhatman

You can now copy+paste code from forums
GreyHead 63.3
November 29 2018 #381875
Hi SPABO,
Please see this FAQ
Bob
ChronoForms technical support
If you'd like to buy me a coffee or two, thank you very much
S
SPABO 637
November 29 2018 #381877
Hi Bob,
It works (almost) fine.
It hides the button, it shows the loading image, but not the text
Please wait while the form submits
Pls advise
GreyHead 63.3
November 29 2018 #381882
Hi Kees,
Please post a link to the form so we can take a quick look.
Bob
ChronoForms technical support
If you'd like to buy me a coffee or two, thank you very much
S
SPABO 637
November 29 2018 #381885
Hi Bob,
Pls find the link https://www.xxxxxx/xxxxxxxxxx/xxxxxxxxxx (changed!!)
This is just for a testing...
Hope you had a change to l;ook at it, I'm about to depublish
S
SPABO 637
December 02 2018 #381950
 Answer
Hi Bob,
It;s working now, there were too many <div> in the design area
Pls find what I have put in, including hiding the reset-button
In the SetUp part, OnLoad
In the HTML (renderform)
Put in Form Class: chronoform
Put in the Form Tag Aattchment: data-gvalidate_success='showLoader'
Load a Load JavaScript Function in the OnLoad Part and put in:
function showLoader() {
jQuery('#loading').show();
jQuery('#submit_btn').prop('disabled', true);
jQuery('#reset_btn').prop('disabled', true);
jQuery('#chronoform-my formname div:not(:last-child)').hide();
}
In the Designer Area.
The Button ID's (re)named to: submit_btn, resp. reset_btn
The loading image comes from the my own (Joomla)image folder.
The customcode must be at the end of the Designer area
<div id='loading' style='display: none'; >
<center><img src='/images/stories/my image.gif' /></center>
<br>
<br>
<center>Een ogenblik geduld, het formulier wordt nu verstuurd</center>
Thanks so far Bob
Rgds Kees