<!-- Default -->
<div class="form-item form-type- form-item-">
<label for="edit-name">
Label
</label>
<input type="text" id="edit-name" name="name" class="form-text" />
</div>
<!-- Text -->
<div class="form-item form-type-text form-item-first-name">
<label for="edit-first-name">
First Name
</label>
<input type="text" id="edit-first-name" name="first-name" class="form-text" />
<div class="description">
<div id="edit-first-name--description" class="webform-element-description">Write here your first name</div>
</div>
</div>
<!-- Select -->
<div class="form-item form-type-select form-item-country">
<label for="edit-country">
Country
</label>
<select id="edit-country" name="country" class="form-select">
<option value="norway" >Norge</option>
<option value="sweden" >Sverige</option>
<option value="finland" >Suomi</option>
</select>
</div>
<!-- Textarea -->
<div class="form-item form-type-textarea form-item-message">
<label for="edit-message">
Your message
</label>
<div class="form-textarea-wrapper">
<textarea id="edit-message" name="message" class="form-textarea resize-vertical"></textarea>
</div>
</div>
<!-- Checkbox -->
<div class="form-item form-type-checkbox form-item-subscribe">
<input type="checkbox" id="edit-subscribe" name="subscribe" class="form-checkbox" />
<label for="edit-subscribe">
Subscribe to Newsletter
</label>
</div>
<!-- Radio -->
<div class="form-item form-type-radio form-item-pizza">
<input type="radio" id="edit-pizza" name="pizza" class="form-radio" />
<label for="edit-pizza">
I want pizza!
</label>
</div>
{% set input %}
<div class="form-item form-type-{{ type }} form-item-{{ name }}">
{% if type != 'checkbox' and type != 'radio' and type != 'hr' %}
{% include '@webform-label' %}
{% endif %}
{% if type == 'hr' %}
{% include '@webform-hr' %}
{% elseif type == 'select' %}
{% include '@webform-select' %}
{% elseif type == 'textarea' %}
{% include '@webform-textarea' %}
{% else %}
{% include '@webform-input' %}
{% endif %}
{% if type == 'checkbox' or type == 'radio' %}
{% include '@webform-label' %}
{% endif %}
{% if description %}
<div class="description">
<div id="edit-{{ name }}--description" class="webform-element-description">{{ description }}</div>
</div>
{% endif %}
</div>
{% endset %}
{% if field.type == 'flexbox' %}
{% include '@webform-flexbox' %}
{% elseif field.type == 'fieldset' %}
{% include '@webform-fieldset' %}
{% elseif field.type == 'checkboxes' %}
{% include '@webform-checkboxes' %}
{% elseif field.type == 'radios' %}
{% include '@webform-radios' %}
{% else %}
{{ input }}
{% endif %}
/* Default: No context defined */
/* Text */
{
"type": "text",
"name": "first-name",
"label": "First Name",
"description": "Write here your first name"
}
/* Select */
{
"type": "select",
"name": "country",
"label": "Country"
}
/* Textarea */
{
"type": "textarea",
"name": "message",
"label": "Your message"
}
/* Checkbox */
{
"type": "checkbox",
"name": "subscribe",
"label": "Subscribe to Newsletter"
}
/* Radio */
{
"type": "radio",
"name": "pizza",
"label": "I want pizza!"
}
There are no notes for this item.