Animation during upload

Ask the community
,
1

I am on a slow connection, like everybody else here. If I fill out my form (with only 1 pic and some text), it takes between 5 and 7 seconds before my ‘Succes’ LightBox appears.
Is there any kind of animation (like the standard turning circle) I can show so people don´t start to click again and again or leave the page?

2

After clicking submit change that button and disable it and then put some object that you will show when clicked and after update is done run hide on that object.

3

Andreas, thank you, that is what I thought too. The problem is HOW? I looked it up and I find a lot of the same questions relating to Ajax or HTML, but I am out of my depths here on how to do that in Wix.
I don´t even know whwere to begin, on the frontside or the backside. Any help would be greatly appreciated.

4

Ok
Lets say your buttons ID is button1. On the onClicked events function add this code:

$w(“#button1”).disable();

That will disable the button once clicked so they can’t click it twice.

Then lets say you add a box with a text within says ”Updating…” and the box ID is box1 show the box after the line above in the same function.

$w(”#box1”).show();

And on the box1 properties panel click that the box will be hidden when page is loaded.

When they click the button the button will be disabled and the box will appear and then you can update the record and when done use .hide() on the box1 and enabled() on the button1.

5

Hi Andreas, I finally got round to implementing this. Your tips were a great help, but they did not work as expected. You prob. already know this, but just for anyone else who wants to achieve the same:

  1. the box-idea works. I put an animated gif Spinner in there, looks good
  2. when the Submit button is attached to a dataset ‘Submit’ action, disabling the button in the onClick doesn´t work. Strangely enough the .Show() for the box and spinner, in the same function, did.
  3. I had more luck attachjing the .show() and hide () AND disabling the buttons using the datasets .onBeforeSave and .onAfterSave

Thanks for your help, it put me on the right track.