Customer form - validation / error not working properly

Technical Q&A
1

Hello Shopify World,

My team been looking at this issue for a while and hoping someone online can help us. We have this newsletter section created for our home page, and upon submission (after the captcha step) the user should either get a “Toast trigger” of form successful (Newsletter subscribed) OR … error message and having the {{ form.errors | default_errors }} message pop up inside the toast.

So far the toasts triggers, and the successful message works great. However, the error validation keeps triggering (even if we visit the page for the first time) AND we don’t see any error message but just “{{ form.errors | default_errors }}”. I’ve attached the sections code in case anyone notices any coding issues:

Appreciate any help like always!

Vince


    

        

            ##### {{set.title}}
        

        

        
            {% form 'customer' %}
                

                    

                        
                        
                    

                    
                        
                    

                

                {% if form.posted_successfully? %}
                    {% assign toast_title = 'Success' %}
                    {% assign toast_message = 'Thank you for signing up to our newsletter!' %}
                    {% render 'toasts-module' toast_title: toast_title, toast_message: toast_message %}
                {% else %}
                    {% assign toast_title = 'Fail' %}
                    {% assign toast_message = "Something went wrong. {{ form.errors | default_errors }}" %}
                    {% render 'toasts-module' toast_title: toast_title, toast_message: toast_message %}
                {% endif %}
            {% endform %}
2

Hi leungvi8,

You can change the code at if:

{% if form.posted_successfully? %}
                    {% assign toast_title = 'Success' %}
                    {% assign toast_message = 'Thank you for signing up to our newsletter!' %}
                    {% render 'toasts-module' toast_title: toast_title, toast_message: toast_message %}
                {% elsif form.errors  %}
                    {% assign toast_title = 'Fail' %}
                    {% assign toast_message = "Something went wrong. {{ form.errors | default_errors }}" %}
                    {% render 'toasts-module' toast_title: toast_title, toast_message: toast_message %}
                {% endif %}
3

Unfortunately, I did try this, but what tends to happen is the error message doesn’t register right away (toast does not trigger). However, if i refresh the page… than i see the error.

4

Oh and the Success seems to work now, but fail trigger doesn’t seem to popup right away.

5

It might be because toasts doesn’t work when you reload the content. Please contact toasts for better support :slightly_smiling_face: