{% load static %}
<div id="exam-list">
    <form id="exam-edit-form">
        {% csrf_token %}
        {{ form.media }}
        <div class="input-group mb-2">
            {{ form.exam }}
            <button class="btn btn-sm btn-primary" type="button" hx-post="{% url 'anatomy:question_add_exam' question_id=question.pk %}" hx-include="#id_exam" hx-target="#exam-list" hx-swap="innerHTML">Save</button>
            <button type="button" class="btn btn-sm btn-outline-secondary" onclick="document.getElementById('exam-list').innerHTML='';">Close</button>
        </div>
    </form>
    <div class="mb-2 small">Current exams:
        {% for exam in question.exams.all %}
            <form class="d-inline me-1" hx-post="{% url 'anatomy:question_add_exam' question_id=question.pk %}" hx-target="#exam-list" hx-swap="innerHTML">
                {% csrf_token %}
                <input type="hidden" name="exam_id" value="{{ exam.id }}">
                <input type="hidden" name="remove" value="true">
                <button class="btn btn-sm btn-outline-danger mb-1" type="submit" hx-confirm="Are you sure you want to remove this exam?">{{ exam }}</button>
            </form>
        {% empty %}
            <span class="text-muted">No exams</span>
        {% endfor %}
    </div>
</div>