Create non-functional UI for editing array fields

This commit is contained in:
Mouse Reeve 2022-03-14 10:42:53 -07:00
parent 916d6a417d
commit a2f2104a08

View file

@ -79,17 +79,37 @@
{% include 'snippets/form_errors.html' with errors_list=form.languages.errors id="desc_languages" %}
</div>
<div class="field">
<label class="label" for="id_subjects">
<div>
<label class="label" for="id_add_subjects">
{% trans "Subjects:" %}
</label>
{{ form.subjects }}
<span class="help" id="desc_subjects_help">
{% trans "Separate multiple values with commas." %}
</span>
{% for subject in book.subjects %}
<label class="label is-sr-only" for="id_add_subject={% if not forloop.first %}-{{forloop.counter}}{% endif %}">
{% trans "Add subject" %}
</label>
<div class="field has-addons">
<div class="control is-expanded">
<input id="id_add_subject-{{ forloop.counter }}" type="text" name="subject-" value="{{ subject }}" class="input">
</div>
<div class="control">
<button class="button is-danger is-light" type="button">
<span class="icon icon-x" title="{% trans 'Remove' %}">
<span class="is-sr-only">{% trans "Remove" %}</span>
</span>
</button>
</div>
</div>
{% endfor %}
<input class="input" type="text" name="add_subject" id="id_add_subject" value="{{ subject }}" {% if confirm_mode %}readonly{% endif %}>
{% include 'snippets/form_errors.html' with errors_list=form.subjects.errors id="desc_subjects" %}
</div>
<span class="help">
<button class="button is-small" type="button" data-duplicate="id_add_subject" id="another_subject_field">
{% trans "Add Another Subject" %}
</button>
</span>
</div>
</section>