HELP! - Contact Form not delivering data from all input fields

[emmap2407]

Hi! I edited the contact-form.liquid code in my theme Crave to add more input fields to my form. However, when I am sent completed forms from my website, only the data from the original fields is shown, not the data entered into the input fields that I added in the code. Please help me understand how to receive all data entered in my edited contact form. Thank you!!

[emmap2407]

Hi!

I can’t seem to find a submission script in my contact-form.liquid code. All of my fields are named uniquely. Please help me find the submission scripts.

Thanks!
Emma

[StoreWatchers]

Hello @emmap2407,

Greetings from the Store Watchers Support Team! Happy to help you today.

Can you please send me a screenshot or paste the contact form code here so I can check?

Let me know if need further assistance

Regards,
Store Watchers Support Team

[emmap2407]

Hello,

I’m attaching screenshots of all the contact-form.liquid code. Please help me capture all the data from my contact submission form!

Thanks,
Emma

[StoreWatchers]

Hello @emmap2407,

It seems that you forgot to attach the screenshot. Please double-check. 

Also, I guess it would be great if you copy the code and directly paste it here so I can debug easily rather than a screenshot.

Let me know if need further assistance

Regards,
Store Watchers Support Team

[emmap2407]

Here is the code, I’m not seeing any scripts about submissions.

{{ 'section-contact-form.css' | asset_url | stylesheet_tag }}

{%- style -%}
.section-{{ section.id }}-padding {
padding-top: {{ section.settings.padding_top | times: 0.75 | round: 0 }}px;
padding-bottom: {{ section.settings.padding_bottom | times: 0.75 | round: 0 }}px;
}

@media screen and (min-width: 750px) {
.section-{{ section.id }}-padding {
padding-top: {{ section.settings.padding_top }}px;
padding-bottom: {{ section.settings.padding_bottom }}px;
}
}
{%- endstyle -%}

{%- if section.settings.heading != blank -%}

{{ section.settings.heading }}

{%- else -%}

{{ 'templates.contact.form.title' | t }}

{%- endif -%}
{%- form 'contact', id: 'ContactForm', class: 'isolate' -%}
{%- if form.posted_successfully? -%}

{% render 'icon-success' %}
{{ 'templates.contact.form.post_success' | t }}

{%- elsif form.errors -%}

{% render 'icon-error' %}
{{ 'templates.contact.form.error_heading' | t }}

• 
  
  {{ form.errors.translated_fields.email | capitalize }}
  {{ form.errors.messages.email }}
  
  

{%- endif -%}

class="field__input"
autocomplete="name"
type="text"
id="ContactForm-name"
name="contact[{{ 'templates.contact.form.name' | t }}]"
value="{% if form.name %}{{ form.name }}{% elsif customer %}{{ customer.name }}{% endif %}"
placeholder="{{ 'templates.contact.form.name' | t }}"
>
{{ 'templates.contact.form.name' | t }}

autocomplete="email"
type="email"
id="ContactForm-email"
class="field__input"
name="contact[email]"
spellcheck="false"
autocapitalize="off"
value="{% if form.email %}{{ form.email }}{% elsif customer %}{{ customer.email }}{% endif %}"
aria-required="true"
{% if form.errors contains 'email' %}
aria-invalid="true"
aria-describedby="ContactForm-email-error"
{% endif %}
placeholder="{{ 'templates.contact.form.email' | t }}"
>

{{- 'templates.contact.form.email' | t }}
* >
{%- if form.errors contains 'email' -%}

{{ 'accessibility.error' | t }}

{%- render 'icon-error' -%}
{{- form.errors.translated_fields.email | capitalize }}
{{ form.errors.messages.email -}}


{%- endif -%}

type="tel"
id="ContactForm-phone"
class="field__input"
autocomplete="tel"
name="contact[{{ 'templates.contact.form.phone' | t }}]"
pattern="[0-9\-]*"
value="{% if form.phone %}{{ form.phone }}{% elsif customer %}{{ customer.phone }}{% endif %}"
placeholder="{{ 'templates.contact.form.phone' | t }}"
>
{{ 'templates.contact.form.phone' | t }}

class="field__input"
autocomplete="organization"
type="text"
id="ContactForm-organization"
organization="contact[{{ 'templates.contact.form.organization' | t }}]"
value="{% if form.organization %}{{ form.organization }}{% elsif customer %}{{ customer.organization }}{% endif %}"
placeholder="{{ 'templates.contact.form.organization' | t }}"
>
{{ 'templates.contact.form.organization' | t }}

class="field__input"
autocomplete="individuals"
type="text"
id="ContactForm-individuals"
individuals="contact[{{ 'templates.contact.form.individuals' | t }}]"
value="{% if form.individuals %}{{ form.individuals }}{% elsif customer %}{{ customer.individuals }}{% endif %}"
placeholder="{{ 'templates.contact.form.individuals' | t }}"
>
{{ 'templates.contact.form.individuals' | t }}

class="field__input"
autocomplete="date"
type="text"
id="ContactForm-date"
date="contact[{{ 'templates.contact.form.date' | t }}]"
value="{% if form.date %}{{ form.date }}{% elsif customer %}{{ customer.date }}{% endif %}"
placeholder="{{ 'templates.contact.form.date' | t }}"
>
{{ 'templates.contact.form.date' | t }}

<br> rows="10"<br> id="ContactForm-body"<br> class="text-area field__input"<br> name="contact[{{ 'templates.contact.form.fundraiser' | t }}]"<br> placeholder="{{ 'templates.contact.form.fundraiser' | t }}"<br> ><br> {{- form.body -}}<br>

{{- 'templates.contact.form.fundraiser' | t -}}

class="field__input"
autocomplete="affiliate"
type="text"
id="ContactForm-affiliate"
affiliate="contact[{{ 'templates.contact.form.affiliate' | t }}]"
value="{% if form.affiliate %}{{ form.affiliate }}{% elsif customer %}{{ customer.affiliate }}{% endif %}"
placeholder="{{ 'templates.contact.form.affiliate' | t }}"
>
{{ 'templates.contact.form.affiliate' | t }}

{{ 'templates.contact.form.send' | t }}

{%- endform -%}

{% schema %}
{
"name": "t:sections.contact-form.name",
"tag": "section",
"class": "section",
"disabled_on": {
"groups": ["header", "footer"]
},
"settings": [
{
"type": "inline_richtext",
"id": "heading",
"default": "Contact form",
"label": "Heading"
},
{
"type": "select",
"id": "heading_size",
"options": [
{
"value": "h2",
"label": "t:sections.all.heading_size.options__1.label"
},
{
"value": "h1",
"label": "t:sections.all.heading_size.options__2.label"
},
{
"value": "h0",
"label": "t:sections.all.heading_size.options__3.label"
}
],
"default": "h1",
"label": "t:sections.all.heading_size.label"
},
{
"type": "select",
"id": "color_scheme",
"options": [
{
"value": "accent-1",
"label": "t:sections.all.colors.accent_1.label"
},
{
"value": "accent-2",
"label": "t:sections.all.colors.accent_2.label"
},
{
"value": "background-1",
"label": "t:sections.all.colors.background_1.label"
},
{
"value": "background-2",
"label": "t:sections.all.colors.background_2.label"
},
{
"value": "inverse",
"label": "t:sections.all.colors.inverse.label"
}
],
"default": "background-1",
"label": "t:sections.all.colors.label"
},
{
"type": "header",
"content": "t:sections.all.padding.section_padding_heading"
},
{
"type": "range",
"id": "padding_top",
"min": 0,
"max": 100,
"step": 4,
"unit": "px",
"label": "t:sections.all.padding.padding_top",
"default": 36
},
{
"type": "range",
"id": "padding_bottom",
"min": 0,
"max": 100,
"step": 4,
"unit": "px",
"label": "t:sections.all.padding.padding_bottom",
"default": 36
}
],
"presets": [
{
"name": "t:sections.contact-form.presets.name"
}
]
}
{% endschema %}

[StoreWatchers]

Hi @emmap2407,

Thank you for providing the code.

Upon checking, I noticed that there are some errors in your custom-added fields.

For example in your custom field organization, please do not use {{ 'templates.contact.form.organization' | t }} as it will cause an error.

Please check and use the below code instead.

<div class="field">
        <input
          type="text"
          id="ContactForm-organization"
          class="field__input"
          name="contact[Organization]"
          value=""
          placeholder="Organization"
        >
        <label class="field__label" for="ContactForm-phone">Organization</label>
      </div>

You can type directly the name of the custom field e.g. Organization. I tested it on my test store and it works fine. Please check the below screenshots.

  

Let me know if need further assistance

Regards,
Store Watchers Support Team