Contact Form is submitting before entering message and then returning "Email Invalid"

Hypanese
New Member
2 0 0

Hi, 

The contact form built-in Shopify that we can add to pages is having a technical issue. 

After inputting something in the "Name" field, customers enter email in the "email" field but the form submits itself immediately before having the time to enter anything in the "Message" field, sometimes even before completing the "email" field. And then the form returns an error message "Email invalid" or sometimes it sends a blank message. 

Feel free to try it yourself by filling out the "Contact Us" form on the product page here: Hypanese Product Page

This contact form is a prebuilt Shopify template and I believe the issue is related to the submitting action being processed as soon as we start inputting into the email field...

I would love some help with this, please. Does anyone know a fix? 

Here is the code of the contact-form.liquid : 

<div class="index-section">
<div class="page-width">

<div class="grid">
<div class="grid__item{% if section.settings.narrow_column %} medium-up--three-quarters medium-up--push-one-eighth{% endif %}">

{%- if section.settings.title != blank -%}
<div class="section-header">
<h2 class="section-header__title">
{{ section.settings.title }}
</h2>
</div>
{%- endif -%}

<div class="form-vertical">
{%- assign form_id = 'contact-' | append: section.id -%}
{%- form 'contact', id: form_id -%}

{%- if form.posted_successfully? -%}
<p class="note note--success">
{{ 'contact.form.post_success' | t }}
</p>
{%- endif -%}

{{ form.errors | default_errors }}

<div class="grid grid--small">
<div class="grid__item medium-up--one-half">
<label for="ContactFormName-{{ section.id }}">{{ 'contact.form.name' | t }}</label>
<input type="text" id="ContactFormName-{{ section.id }}" class="input-full" name="contact[name]" autocapitalize="words" value="{% if form.name %}{{ form.name }}{% elsif customer %}{{ customer.name }}{% endif %}">
</div>

<div class="grid__item medium-up--one-half">
<label for="ContactFormEmail-{{ section.id }}">{{ 'contact.form.email' | t }}</label>
<input type="email" id="ContactFormEmail-{{ section.id }}" class="input-full" name="contact[email]" autocorrect="off" autocapitalize="off" value="{% if form.email %}{{ form.email }}{% elsif customer %}{{ customer.email }}{% endif %}">
</div>
</div>

{%- if section.settings.show_phone -%}
<label for="ContactFormPhone-{{ section.id }}">{{ 'contact.form.phone' | t }}</label>
<input type="tel" id="ContactFormPhone-{{ section.id }}" class="input-full" name="contact[phone]" pattern="[0-9\-]*" value="{% if form.phone %}{{ form.phone }}{% elsif customer %}{{ customer.phone }}{% endif %}">
{%- endif -%}

<label for="ContactFormMessage-{{ section.id }}">{{ 'contact.form.message' | t }}</label>
<textarea rows="5" id="ContactFormMessage-{{ section.id }}" class="input-full" name="contact[body]">{% if form.body %}{{ form.body }}{% endif %}</textarea>

<button type="submit" class="btn">
{{ 'contact.form.send' | t }}
</button>

 

Cheers

Julien

 

0 Likes

Hello

Look I have checked your store , there is a issue of time consuming, Need to check files ,you have to do code customization work, if you having coding knowledge
We are available for your work If you wish !
If you Want to modify or incorporate custom changes on store, Hire us, We are having expert shopify developers
Please you can contact me on this
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87

Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
0 Likes
Hypanese
New Member
2 0 0

Can you please propose a solution to this first? 

This is a Shopify bug, not something I have manually changed nor edited. 

Thanks for helping. 

0 Likes