am-impact / amforms

Forms plugin for Craft
Other
121 stars 21 forks source link

Custom error message #163

Open dbig opened 6 years ago

dbig commented 6 years ago

Hello, I'm struggling with field error handling. Specifically, using a custom error message, either form-wide, or per field (with handle, for example).

Here is my form template...

<-form>

{{ getCsrfInput() }}

{# This should always be here! #}
<input type="hidden" name="action" value="amForms/submissions/saveSubmission">

{# Insert your form's handle. #}
<input type="hidden" name="handle" value="{{ form.handle }}">

{# Optional: Anti-spam protection. #}
{{ craft.amForms.displayAntispam() }}

{# Place the HTML of your fields here #}
{{ form.displayField('emailAddress') }}
{{ form.displayField('fullName') }}
{{ form.displayField('telephoneNumber') }}
{{ form.displayField('project') }}
{{ form.displayField('details') }}

{# <input type="submit" value="Submit"> #}

<div class="small-12 cell submit">
    {{ craft.amForms.displayRecaptcha() }}
    <button class="button send" type="submit">{{ "get in touch" | translate }} <img src="/assets/img/solutions-page-nav-arrow.jpg" alt="{{ "get in touch" | translate }}"></button>
</div>

<-/form>

And my fields template...

{%- set element = (element is defined ? element : null) %}
{%- set handle = (field.handle is defined ? field.handle : null) %}
{%- set label = (field.name is defined ? field.name : null) %}
{%- set instructions = (field.instructions is defined ? field.instructions : null) %}
{%- set fieldInfo = craft.fields.populateFieldType(field, element) %}
{%- set type = field.type|lower %}
{%- set errors = element.getErrors(field.handle) -%}

{%- set namespace = null -%}
{%- if not form.submitAction %}
    {%- set namespace = (fieldInfo.namespace is defined ? fieldInfo.namespace : 'fields') %}
{% endif -%}

{% namespace namespace %}
{% if field.type == 'AmForms_Hidden' %}
        {{ input|raw }}
    {% else %}

    {% if label or instructions -%}
        <div class="small-3 cell form__label {{ handle }}">
            {% if label -%}
                <label class="text-left middle{% if required is defined and required %} required{% endif %}" {% if handle %} for="{{ handle }}"{% endif %}>
                    {{ label|raw|t }}
                </label>
            {% endif %}
            {% if instructions -%}
                <em>{{ instructions|raw }}</em>
            {% endif %}
        </div>
    {% endif %}

    <div class="small-9 cell form__field {{ handle }} {% if errors %} errors{% endif %}">
        {{ input|raw }}

        {% if errors -%}
            <ul class="errors">
                {% for error in errors -%}
                    <li>{{ "Error Missing field – Please complete all required fields." | translate }}</li>
                {% endfor -%}
            </ul>
        {% endif -%}
    </div>
{% endif %}
{% endnamespace %}

At the bottom of the fields template I have the desired error text (localized), but when it renders, only the browser's default error message - Please fill in this field. - displays.

I have searched all issues here, and craft slack for some direction, but no to avail.

What am I missing?

Thanks, Doug

dbig commented 6 years ago

Hello, Due to other issues regarding features not working with my form's markup, I've resorted to using the default templates.

Still receiving the default HTML5 validation error. What is the trick to enable a custom validation error message?

Thanks, Doug

dbig commented 6 years ago

I see in the README.md that there is a section 'Errorlist macro', but it's example code provides limited context, which is not clear to me. It's difficult to understand how this would be integrated into the default templates.