How to display the form plugin "Thank You" message in a modal popup?

plugins
form
theme

#1

Hi everyone,

I’m using the Ceevee theme and the form plugin with email included in the theme.
The form is in the “Contact” page and the success message in a “thank you” page.
When the form is submitted and the email sent, the form redirects the website to /home with the “thankyou” message page under the “about” section of the website.

I want to display this “thank you” message page in a modal popup.
I suppose it can be done almost natively as I saw many included css and js mentioning modal pop ups (i.e. magnific-popup.js and css plus “popup-modal” class in the layout.css) but I can’t figure out how to modify the plugin to do so.

For the moment I got this modular.md at the root of my Homepage,

form:
name: my-nice-form
action: /home
fields:
-
name: name
label: Nom
placeholder: ‘Entrer votre nom’
autocomplete: ‘on’
type: text
validate:
required: true
-
name: email
label: Email
placeholder: ‘Saisissez votre adresse email’
type: text
validate:
rule: email
required: true
-
name: message
label: Message
size: long
placeholder: ‘Nombre d exemplaires et adresse’
type: textarea
validate:
required: true
buttons:
-
type: submit
value: Envoyer
class: submit
process:
-
email:
from: ‘{{ config.plugins.email.from }}’
to:
- ‘{{ config.plugins.email.to }}’
- ‘{{ form.value.email }}’
subject: ‘[Feedback] {{ form.value.name|e }}’
body: ‘{% include ‘‘forms/data.html.twig’’ %}’
-
save:
fileprefix: feedback-
dateformat: Ymd-His-u
extension: txt
body: ‘{% include ‘‘forms/data.txt.twig’’ %}’
-
message: ‘Merci !’
-
display: thankyou

The thankyou message is a “formdata” template hidden page.

I found this related request on the website, but I can’t figure out how to do it:
https://discourse.getgrav.org/t/thank-you-message-in-div-or-modal/2402

If you can give me some hints here it would be appreciated. Thanks in advance.
regards


#2

Have you tried this one step by step? Since you referred to a form article with no modular form? :slight_smile:
https://learn.getgrav.org/forms/forms/how-to-forms-in-modular-pages


#3

Thank you @RobLui, I already came across this article but I’m new to Grav and it’s particular workflow.
I will check this article more carefully and will post here the result.