PLEASE NOTE: These forums are no longer utilized and are provided as an archive for informational purposes only. All support issues will be handled via email using our support ticket system. For more detailed information on this change, please see this blog post.

Loading Screen while Processing Large Forms (User Registration on Multisite)

  1. I am using user-registration for my multisite signup/site-creation form. After the form is submitted a new blog is created from a template blog, which is fairly large, and it takes 20-30+ seconds to create the new site after the form is submitted. Is there someway to display a loading screen/page/popup/animation while everything is processing so users don't click the 'back' or 'refresh' buttons and disrupt the process?

    I have seen this on other membership sites and alike, but have no idea how to go about setting this up or even starting to set it up. Help is sincerely appreciated here.

    Posted 12 years ago on Thursday August 2, 2012 | Permalink
  2. Does this happen before the confirmation message is shown? It just appears to the visitor that the browser is hung and not really doing anything? If so, we just need to insert some sort of "loading" animation which lasts 30 seconds AFTER the form is submitted?

    Posted 12 years ago on Thursday August 2, 2012 | Permalink
  3. I have a redirect instead of a confirmation that takes them to the admin area of the new site, the blank screen shows since the redirect takes so long. I was thinking the same thing. How can I do that?

    Posted 12 years ago on Thursday August 2, 2012 | Permalink
  4. How about if you send them to an interim page which shows an animation, and then reloads after 30 seconds and directs them to the page you currently have as your Gravity Forms redirect?

    Right now, you have:
    Gravity Forms > Redirect to admin area

    You could do:
    Gravity Forms > Interim "loading" page > Redirect to admin area

    Would that work? I am going to work on a page right now to do that for you. You will have to add your URL for the admin area to the page, and you can obviously customize it. I will just put something together quickly as proof of concept.

    Posted 12 years ago on Friday August 3, 2012 | Permalink
  5. Okay sounds great, thanks.

    My one question though is wouldn't it still take the 20-30 seconds to load/redirect to the interim page that it would to redirect to the admin?

    Posted 12 years ago on Friday August 3, 2012 | Permalink
  6. I'm not sure if that will happen or not. I don't think so, based on where the delay is occurring, but we can try it.

    Here is the code: http://pastebin.com/rtiaqZem

    Save that code to a file on your server which is accessible to the public. Call it "thank-you.html" or something. If it's in the root of your site, and your site is ktrusak.com, the URL that you use for the Gravity Form confirmation redirect would be http://ktrusak.com/thank-you.html .

    Be sure to grab this image and save it in the same directory as the HTML file:
    http://meridianivr.meridinet.com/chat/images/loadingAnimation.gif

    Try loading that thank-you.html URL in your browser to make sure this part is set up correctly.

    If that works, go ahead and modify the file at http://pastebin.com/rtiaqZem - you will need to change a couple things. The URL where you want to send them after the site is created, and the timeouts. I have the automatic redirect at 30 seconds and then if the browser does not obey that, there is a text link which will appear after 35 seconds. You can adjust both those numbers, and you need to change the URL from example.com in two places, to the URL you were using for the Gravity Forms confirmation redirect.

    Update: this all works pretty well, but you may be right that the delay occurs after accessing the admin area of the new site, when first redirected there. I'm not sure how or when the sites are being created from your site template, so we will have to try this and if it does not work, come up with another solution. Let me know if you need any help with implementation. Thanks.

    Posted 12 years ago on Friday August 3, 2012 | Permalink
  7. That page itself you made works perfectly and looks great. The redirects were still the same though, meaning that the page was taking awhile to load before executing the redirect. I was able to actually make a pretty good dent on the load by time upgrading my vps settings ($) , but I would still like a message for days with more traffic than just me.

    Could I tie the javascript to the button maybe? Like 'onclick'->'lightbox w/ gif and message' while leaving the redirects and such the same?

    Posted 12 years ago on Friday August 3, 2012 | Permalink
  8. Yes, you could do that. That was my alternate approach :-)

    Let me think about how to do that one, insinuate that loading gif into the middle of the process here, but still letting the site creation begin.

    I guess what needs to happen is the admin area page needs to be accessed to start the site creation process; is that correct? What is unique about the URL that ensures that a new site is created with the new information for the latest visitor? Is the subdomain different or are there query string parameters sent along? What plugin are you using for creating the sites from a template?

    Posted 12 years ago on Friday August 3, 2012 | Permalink
  9. Actually, as soon as the form is submitted the site creation starts. The user can't access the site url til there is a site... it the user registration add-on so the site is created as usual. I am using the wp replicator plugin. (sorry for the delayed response I don't get the emails for some reason)

    Posted 12 years ago on Friday August 3, 2012 | Permalink
  10. So where is the delay coming from? As which stage?

    Posted 12 years ago on Friday August 3, 2012 | Permalink
  11. The "subscribe to topic" function with the bbPress forum software is ... flaky sometimes. Sorry about that.

    Posted 12 years ago on Friday August 3, 2012 | Permalink
  12. The delay comes while the form is submitting information. So the second the button is clicked it takes the 20-30 seconds for anything to happen next. I am actually not getting a blank screen now. It just sits on the form for the 20-30 seconds.

    I had a thought to try and just modify the button. Is it possible to just add an additional function to a button besides form submit?

    add_filter("gform_submit_button_10", "form_submit_button", 10, 2);
    function form_submit_button($button, $form){
        return "<a href="#loadlightbox" class="lightbox"><button class='button' id='gform_submit_button_10'><span>Submit</span></button></a>";
    }

    ^this gives me an unexpected t string

    Posted 12 years ago on Friday August 3, 2012 | Permalink
  13. Oh, the part that isn't seen would be this div that doesn't appear on the screen, but is activated when the link is clicked

    <div id="loadlightbox" style="display:none;">Text and gif to display during load before redirect</div>

    Posted 12 years ago on Friday August 3, 2012 | Permalink
  14. There is a syntax error in that. You can try this. I didn't check it, but at least the syntax error is fixed:

    [php]
    add_filter("gform_submit_button_10", "form_submit_button", 10, 2);
    function form_submit_button($button, $form){
        return "<a href='#loadlightbox' class='lightbox'><button class='button' id='gform_submit_button_10'><span>Submit</span></button></a>";
    }

    Report back please.

    Posted 12 years ago on Friday August 3, 2012 | Permalink
  15. Sounds like what we want to do is really just let the submit work normally, but put up a fake progress/loading animation. How about something like this?

    http://www.gravityhelp.com/forums/topic/add-a-file-upload-progress-bar#post-6584

    Posted 12 years ago on Friday August 3, 2012 | Permalink
  16. That appears to be exactly what I was looking for, I will implement it now and let you know if that does the trick.

    Posted 12 years ago on Saturday August 4, 2012 | Permalink
  17. OK. There's always more than one way to do it. If this does not work, we'll come up with something else. Thanks for being flexible.

    Posted 12 years ago on Saturday August 4, 2012 | Permalink
  18. Chris Hajer;

    That did the trick beautifully! I was able to setup a fully custom screen that pops up after form submission, it looks great and does exactly what I wanted. Thanks for all your help

    http://imgur.com/bMMTg

    Posted 12 years ago on Saturday August 4, 2012 | Permalink
  19. Pretty cool. Glad you were able to work that out. Thanks for the update.

    Posted 12 years ago on Saturday August 4, 2012 | Permalink

This topic has been resolved and has been closed to new replies.