Success Message in Modal

  • Resolved lobert

    (@lobert)


    4 years, 7 months ago

    Hi – I have an issue with a form in a modal window. The form works fine, but the issue is after submission the page reloads and the success message is in the modal, which is now closed so the user does not see it.

    Can I have the success message appear in the modal, and somewhere else on the page? I’m using target=”#form” to bring the user to a specified section on the page after reload and if I could also show the success message there then that could work. But is it possible to have the success shown outside of the form as well? If yes, how could this be achieved.

    Otherwise I can redirect to another page redirect=”/thank-you/” but is it possible to pass the success message onto this this page? If so, how can I do this?

    Thanks

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author fabianlindfors

    (@fabianlindfors)

    Hi!

    I’m guessing that your modal is triggered by Javascript though which means that it will be closed once the page is reloaded. You’ll have to configure your modal to automatically show up if the form is showing a success message. You can do this by checking for a div with class af-success. How this should be done is highly dependent on what modal solution you’re using.

    Showing the success message in another place on the page is technically possible but more complicated.

    Hope that helps!

    Thread Starter lobert

    (@lobert)

    Hi Fabian,

    Thanks for getting back to me. I was thinking about doing that – no really, I was! ??

    I’m using UIKit. I added the following and it worked!

    if (document.getElementsByClassName('af-success').length){ UIkit.modal('#request').show();
}

    Thanks

    • This reply was modified 4 years, 7 months ago by lobert.
    • This reply was modified 4 years, 7 months ago by lobert.
    • This reply was modified 4 years, 7 months ago by lobert.
    • This reply was modified 4 years, 7 months ago by lobert.
    • This reply was modified 4 years, 7 months ago by lobert.
    • This reply was modified 4 years, 7 months ago by lobert.

    We’re looking for a similar solution, but would rather use AJAX to capture and complete the submission – the page reload seems unnecessary.

    Is there a known solution for AJAX submissions, or an example we can see working?

    Thanks!

    Plugin Author fabianlindfors

    (@fabianlindfors)

    Hi! Unfortunately, there is currently no way of enabling AJAX submissions as it’s a bit tricky to get working with ACF!

    @fabianlindfors thanks for the reply – do you have any pointers, we will take a first go at making it work – which classes do we need to work on to capture and process the form data and what are the known issues that make this complex, when leveraging ACF?

    Thanks!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Success Message in Modal’ is closed to new replies.