Form message not displaying after submission

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

    ---
    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

{# 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>

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:

process:
    -
        email:
            subject: 'bla bla'
            body: "{% include 'forms/data.html.twig' %}"
            from: 'something@other.net'
            to: 'something@other.net'
    -
        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:

---
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!

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

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

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

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

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

---
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

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