Настройка
Я создал пользовательскую форму для Shopify, скопировав контактную форму по умолчанию и отредактировав ее в соответствии с руководством Shopify: https://shopify.dev/tutorials/customize-theme-add-fields-to-your-contact-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 = 'LeaseApplicationForm' -%}
{% 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 }}-bedrijfsnaam">Bedrijfsnaam<span aria-hidden="true">*</span></label>
<input
type="bedrijfsnaam"
id="{{ formId }}-bedrijfsnaam"
name="contact[bedrijfsnaam]"
autocorrect="off"
autocapitalize="off"
aria-required="true"
>
</div>
<div class="grid__item medium-up--one-half">
<label for="{{ formId }}-kvk-nummer">KvK-nummer<span aria-hidden="true">*</span></label>
<input
type="kvk-nummer"
id="{{ formId }}-kvk-nummer"
name="contact[kvk-nummer]"
autocorrect="off"
autocapitalize="off"
aria-required="true"
>
</div>
<div class="grid__item medium-up--one-half">
<label for="{{ formId }}-website">Website</label>
<input
type="website"
id="{{ formId }}-website"
name="contact[website]"
autocorrect="off"
autocapitalize="off"
aria-required="false"
>
</div>
<div class="grid__item medium-up--one-half">
<label for="{{ formId }}-telefoon">Telefoon<span aria-hidden="true">*</span></label>
<input
type="telefoon"
id="{{ formId }}-telefoon"
name="contact[telefoon]"
autocorrect="off"
autocapitalize="off"
aria-required="true"
>
</div>
<div class="grid__item medium-up--one-half">
<label for="{{ formId }}-naam-aanvrager">Naam aanvrager<span aria-hidden="true">*</span></label>
<input
type="naam-aanvrager"
id="{{ formId }}-naam-aanvrager"
name="contact[naam-aanvrager]"
autocorrect="off"
autocapitalize="off"
aria-required="true"
>
</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="input-error-message">
<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 class="grid__item medium-up">
<label for="{{ formId }}-looptijd">Looptijd<span aria-hidden="true">*</span></label>
<select id="{{ formId }}-looptijd" name="contact[looptijd]">
<option>15 maanden</option>
<option>24 maanden</option>
<option>30 maanden</option>
<option>36 maanden</option>
<option>42 maanden</option>
<option>48 maanden</option>
<option>60 maanden</option>
</select>
</div>
<label for="{{ formId }}-message">Te leasen product(en)</label>
<textarea rows="10" id="{{ formId }}-message" name="te-leasen-product(en)" placeholder="b.v. 1x PodoMonium Wizzle" >{% if form.body %}{{ form.body }}{% endif %}</textarea>
<input type="submit" class="btn" value="{{ 'contact.form.submit' | t }}">
{% endform %}
</div>
</div>
</div>
</div>
Выпуск
На входе все работает нормально; пользователи могут заполнить все поля и отправить. Хотя на сервере я получаю все, кроме ввода из последнего поля textarea.
Я уже некоторое время пытаюсь это исправить, но не уверен, почему он не работает. В настоящее время он запущен с использованием строки input, но это дает пользователям только 1 строку для заполнения. Мне нужно несколько строк.
Что я делаю не так?