67 lines
2.4 KiB
HTML
67 lines
2.4 KiB
HTML
<div id="validation-form-content">
|
|
<div class="row">
|
|
<div class="col">
|
|
<div class="mb-3">
|
|
<label for="validation-form-number" class="form-label">Enter name, length 3..10</label>
|
|
<input
|
|
type="text"
|
|
class="form-control {{ conditional_cls({
|
|
"is-invalid": validation.name_error,
|
|
"is-valid": validation.validated and not validation.name_error,
|
|
}) }}"
|
|
name="name"
|
|
id="validation-form-number"
|
|
value="{{ validation.name | default_if_none("") }}"
|
|
/>
|
|
{% if validation.name_error %}
|
|
<div class="invalid-feedback">{{ validation.name_error }}</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
<div class="col">
|
|
<div class="mb-3">
|
|
<label for="validation-form-number" class="form-label">Enter age, 1..100</label>
|
|
<input
|
|
type="text"
|
|
class="form-control {{ conditional_cls({
|
|
"is-invalid": validation.age_error,
|
|
"is-valid": validation.validated and not validation.age_error,
|
|
}) }}"
|
|
name="age"
|
|
id="validation-form-number"
|
|
value="{{ validation.age | default_if_none("") }}"
|
|
/>
|
|
{% if validation.age_error %}
|
|
<div class="invalid-feedback">{{ validation.age_error }}</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-check">
|
|
<input
|
|
class="form-check-input {{ conditional_cls({
|
|
"is-invalid": validation.consent_error,
|
|
"is-valid": validation.validated and not validation.consent_error,
|
|
}) }}"
|
|
type="checkbox"
|
|
name="consent"
|
|
id="consent-checkbox"
|
|
{% if validation.consent %}checked{% endif %}
|
|
>
|
|
<label class="form-check-label" for="consent-checkbox">
|
|
I consent to use this data for what ever you want
|
|
</label>
|
|
{% if validation.consent_error %}
|
|
<div class="invalid-feedback">{{ validation.consent_error }}</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
|
|
{% if validation.is_valid %}
|
|
<script>
|
|
toastSuccess.show();
|
|
</script>
|
|
{% endif %}
|