Community guidelines

Please keep discussions civil and on-topic. Repeated violations may lead to a temporary ban.

Forms & Blueprints

Form message not displaying after submission

Solved by Chris Lloyd View solution

Started by Chris Lloyd 7 years ago · 3 replies · 981 views

7 years ago

I have read the docs for forms and cannot seem to get this to work. I feel like there are some gaps in the docs as I don't feel like I have the big picture about how the forms plugins / templates are working behind the scenes after submission.

My form is a modular template as I am using it twice on the website. It is submitting and saving the text file but not displaying the thank you message.

I have tried removing the form action, moving the form into form.md, directly referencing the form-messages.html.twig in template, adding reset to the yaml, etc. Can't seem to figure it out.

Website Page Hierarchy

/home
- /section1
- /section2
- /contact-us
/about
/partners
/contact
- /contact-us

contact.yaml

YAML

    ---
    title: Contact
    name: contact
    content:
      items: '@self.modular'
    cache_enable: false
    form:
      action: /contact
      method: POST
      name: contact-form
      fields:
        -
          name: name
          id: name
          label: Name
          placeholder: Name
          type: text
          autofocus: true
          validate:
            required: true
        -
          name: email
          id: email
          label: Email
          placeholder: Email
          type: text
          validate:
            required: true
        -
          name: subject
          id: subject
          label: Subject
          placeholder: Subject
          type: text
          validate:
            required: true
        -
          name: message
          id: message
          label: Message
          placeholder: 'What''s on your mind?'
          type: textarea
          validate:
            required: true
      buttons:
        -
          type: submit
          value: Send
      process:
        - ip:
            label: User IP Address
        -
          email:
            from: '{{ config.plugins.email.from }}'
            to: '{{ config.plugins.email.to }}'
            subject: 'Message: {{ form.value.name|e }} - {{ form.value.subject|e }}'
            body: '{% include ''forms/data.html.twig'' %}'
        -
          save:
            fileprefix: contact-
            dateformat: Ymd-His-u
            extension: txt
            body: '{% include ''forms/data.txt.twig'' %}'
        -
          message: 'Thank you for getting in touch!'
    ---

Template

TWIG

{# VARIABLES #}
{% set page_title = page.title | regex_replace('/[^a-zA-Z0-9\s ]*/', '') | hyphenize | lower %}

{# TEMPLATE #}
<section id="{{ page_title }}" class="contact">
    <div class="contact__form">
        <div class="contact__form__content">
            <h2 class="contact__title">{{ page.header.heading }}</h2>  
            {% block module_content %}
                {{ content }}
                {% include "forms/form.html.twig" %}
            {% endblock %}
        </div>
    </div>
    <div class="contact__iframe">
        {{ page.header.maps.iframe | raw }}
    </div>
</section>

last edited 07/22/19 by Chris Lloyd

7 years ago

I'm guessing here, based on what has worked for me… I think you need to set a display: option in your process:. For example, this is the relevant part of a contact form that works for me:

TWIG

process:
    -
        email:
            subject: 'bla bla'
            body: "{% include 'forms/data.html.twig' %}"
            from: '[email protected]'
            to: '[email protected]'
    -
        message: 'Thank you for your message, we will get back to you soon.'
    -
        display: thankyou

Then I have a thankyou subfolder in the contact form's folder which contains a file called formdata.md, it looks like this:

YAML

---
title: Your message has been sent
cache_enable: false
process:
    twig: true
---

## Your message has been sent

Underneath this my message gets displayed as I defined it in the form.md file. Hope this helps!

7 years ago

Thank you for the response, I will give this a try this afternoon and advise whether it worked or not.

7 years ago Solution

Your response was correct but not the reason the form was not working. I found out after much troubleshooting that the issue is with multiple language support being enabled for my website. I have to support english/french and that is causing problems with the form submission/redirects.

I discovered this issue created in github a couple of years ago which describes the issue I have been having perfectly.

PROBLEM: The forms do not redirect to the correct page when multiple languages are enabled. They attempt to route to the page without the language as part of the URL.

SOLUTION: You must include the '/en/' (whatever language you are supporting) as part of the form action and do this for every form / language.

WORKING EXAMPLE.

Structure

/Pages
- /test-form
- - form.en.md
- - /thankyou
- - - formdata.md
/custom-theme
- /templates
- - form.html.twig

templates/form.html.twig

TWIG

{% extends 'partials/base.html.twig' %}

{% block content %}
    {{ content }}
    {% include "forms/form.html.twig" %}
{% endblock %}

pages/test-form/test-form.en.md

YAML

---
title: form
form:
    name: test-form
    action: /en/form
    method: POST

    fields:
        name:
            label: Your Name
            type: text

    buttons:
        submit:
            type: submit
            value: Submit

    process:
        message: 'Thank you for your submission!'
        display: thankyou
---

## A test form

Just some random text

pages/test-form/thankyou/formdata.md

YAML

---
title: Email sent
cache_enable: false
process:
twig: true
---
## Email sent!

Topic	Replies	Views	Activity
Getting modular form to work with Typhoon template Forms & Blueprints · by Ton Haarmans, 5 years ago	13	1136	4 months ago
Form works different on different devices Forms & Blueprints · by Hugo Oliveira, 5 months ago	0	61	5 months ago
Include checkbox options from another file Forms & Blueprints · by Flachy Joe, 6 months ago	9	135	6 months ago
Modular page blueprints load, but their custom fields don’t appear in Admin Forms & Blueprints · by Augustus, 7 months ago	7	110	7 months ago
Importing blueprint stopped working (Grav 1.8) Forms & Blueprints · by Julien, 7 months ago	10	129	7 months ago

Suggested topics