Contact form issues

[dph11]

Hi All-

I have created a custom form on a Shopify page and when I submit it gives me "Please adjust the following:" there is no message on what the error is. Can anyone help with this?

Here is the code for the form:

<div class="page-width">
<div class="grid">
<div class="grid__item medium-up--five-sixths medium-up--push-one-twelfth">
<div class="section-header text-center">
<h1>{{ page.title }}</h1>
</div>

{% if page.content.size > 0 %}
<div class="rte">
{{ page.content }}
</div>
{% endif %}

<div class="contact-form form-vertical">
{%- assign formId = 'ContactForm' -%}
{% form 'contact', id: formId %}
{% include 'form-status', form: form, form_id: formId %}

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

<label for="{{ formId }}-email">{{ 'contact.form.email' | t }} <span aria-hidden="true">*</span></label>
<input
type="email"
id="{{ formId }}-email"
name="contact[email]"
autocorrect="off"
autocapitalize="off"
value="{% if form.email %}{{ form.email }}{% elsif customer %}{{ customer.email }}{% endif %}"
aria-required="true"
{%- if form.errors contains 'email' -%}
class="input--error"
aria-invalid="true"
aria-describedby="{{ formId }}-email-error"
{%- endif -%}
>
{%- if form.errors contains 'email' -%}
<span id="{{ formId}}-email-error" class="Error with Email">
<span class="visually-hidden">{{ 'general.accessibility.error' | t }} </span>
{% include 'icon-error' %}
<span>{{ form.errors.translated_fields['email'] | capitalize }} {{ form.errors.messages['email'] }}.</span>
</span>
{%- endif -%}
</div>
</div>

<label for="contactformBusiness">Business Name<span aria-hidden="true">*</span></label>
<input
type="text"
id="contactformBusiness"
name="contact[Business]

/>
<label for="contactformwebsite">Website<span aria-hidden="true">*</span></label>
<input
type="text"
id="contactformWebsite"
name="contact[Website]

/>

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

<label for="{{ formId }}-message">{{ 'contact.form.message' | t }}<span aria-hidden="true">*</span></label></label>
<textarea rows="10" id="{{ formId }}-message" name="contact[{{ 'contact.form.message' | t }}]">{% if form.body %}{{ form.body }}{% endif %}</textarea>

<label for="Eligible Documents">Please select the document type from the pull-down menu and SUBMIT. To accelerate the process, please email eligible documents to: maryelizabeth.peterson@gmail.com.</label>
<select id="Eligible Documents" name=Document[Type]">

<option>Current Business License</option>
<option>Resale or Tax Certificate</option>
<option>Proof of current membership to Design Professional Organization</option>
</select>





<input type="submit" class="btn" value="{{ 'contact.form.submit' | t }}">

{% endform %}
</div>
</div>
</div>
</div>

[KetanKumar]

@dph11 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!😊
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

[dph11]

@KetanKumar Thanks! My site is in development stages and is not live yet. How can I show you?

[LitCommerce]

Hi @dph11,

Please change code:

<div class="page-width">
  <div class="grid">
    <div class="grid__item medium-up--five-sixths medium-up--push-one-twelfth">
      <div class="section-header text-center">
        <h1>{{ page.title }}</h1>
      </div>

      {% if page.content.size > 0 %}
      <div class="rte">
        {{ page.content }}
      </div>
      {% endif %}

      <div class="contact-form form-vertical">
        {%- assign formId = 'ContactForm' -%}
        {% form 'contact', id: formId %}
        {% include 'form-status', form: form, form_id: formId %}

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




            <label for="{{ formId }}-email">{{ 'contact.form.email' | t }} <span aria-hidden="true">*</span></label>
            <input
                   type="email"
                   id="{{ formId }}-email"
                   name="contact[email]"
                   autocorrect="off"
                   autocapitalize="off"
                   value="{% if form.email %}{{ form.email }}{% elsif customer %}{{ customer.email }}{% endif %}"
                   aria-required="true"
                   {%- if form.errors contains 'email' -%}
                   class="input--error"
                   aria-invalid="true"
                   aria-describedby="{{ formId }}-email-error"
                   {%- endif -%}
                   >
            {%- if form.errors contains 'email' -%}
            <span id="{{ formId}}-email-error" class="Error with Email">
              <span class="visually-hidden">{{ 'general.accessibility.error' | t }} </span>
              {% include 'icon-error' %}
              <span>{{ form.errors.translated_fields['email'] | capitalize }} {{ form.errors.messages['email'] }}.</span>
            </span>
            {%- endif -%}
          </div>
        </div>

        <label for="contactformBusiness">Business Name<span aria-hidden="true">*</span></label>
        <input type="text" id="contactformBusiness" name="contact[Business]"/>
        <label for="contactformwebsite">Website<span aria-hidden="true">*</span></label>
        <input type="text" id="contactformWebsite" name="contact[Website]" />
        <label for="{{ formId }}-phone">{{ 'contact.form.phone' | t }}</label>
        <input type="tel" id="{{ formId }}-phone" name="contact[{{ 'contact.form.phone' | t }}]" pattern="[0-9\-]*" value="{% if form[phone] %}{{ form[phone] }}{% elsif customer %}{{ customer.phone }}{% endif %}">
        <label for="{{ formId }}-message">{{ 'contact.form.message' | t }}<span aria-hidden="true">*</span></label>
        <textarea rows="10" id="{{ formId }}-message" name="contact[{{ 'contact.form.message' | t }}]">{% if form.body %}{{ form.body }}{% endif %}</textarea>
        <label for="eligible-Documents">Please select the document type from the pull-down menu and SUBMIT. To accelerate the process, please email eligible documents to: maryelizabeth.peterson@gmail.com.</label>
        <select id="eligible-Documents" name="Document[Type]">
          <option>Current Business License</option>
          <option>Resale or Tax Certificate</option>
          <option>Proof of current membership to Design Professional Organization</option>
        </select>
        <input type="submit" class="btn" value="{{ 'contact.form.submit' | t }}">
        {% endform %}
      </div>
    </div>
  </div>
</div>

Hope it helps!