quiz-the-word/admin/templates/admin/edit_question.html

{% extends "admin/base.html" %}

{% block body %}
    <form class="container mt-5" method="post">
        <div class="form-group">
            <label for="question_text">Question</label>
            <input id="question_text" name="question_text" type="text" class="form-control" value="{{ question.question }}">
        </div>
        <div class="form-group">
            <label for="answer">Answer</label>
            <input id="answer" name="answer" type="text" class="form-control" value="{{ question.answer }}">
        </div>
        <div class="form-group">
            <label for="addresses">Bible Verses</label>
            <input id="addresses" name="addresses" type="text" class="form-control" value="{{ question.addresses }}">
        </div>
        {% if question.multiple_choice is not none %}
            <label class="mt-3">Multiple Choice</label>
            <div class="form-group">
                <label for="multiple_choice_difficulty">Difficulty</label>
                <div class="form-group">
                    <select id="multiple_choice_difficulty" name="multiple_choice_difficulty" class="custom-select">
                        <option {% if question.multiple_choice.difficulty is none %}selected=""{% endif %}>None</option>
                        <option {% if question.multiple_choice.difficulty == 1 %}selected=""{% endif %} value="1">Easy</option>
                        <option {% if question.multiple_choice.difficulty == 2 %}selected=""{% endif %} value="2">Medium</option>
                        <option {% if question.multiple_choice.difficulty == 3 %}selected=""{% endif %} value="3">Hard</option>
                    </select>
                </div>
                <div class="form-group">
                    <label>Wrong Answers</label>
                    <ul class="list-group">
                        {% for answer in question.multiple_choice.wrong_answers %}
                            <li class="list-group-item d-flex justify-content-between align-items-center">
                                <input id="answer_{{ loop.index0 }}" name="wrong_answers" class="form-control" value="{{ answer }}">
                                <button class="btn" type="button" onclick="$(this).parent().remove()"><i class="fas fa-times"></i></button>
                            </li>
                        {% endfor %}
                    </ul>
                    <button id="add_wrong_answer" class="btn btn-secondary" type="button">Add Answer</button>
                </div>
            </div>
        {% endif %}
        {% if question.hidden_answer is not none %}
            <label class="mt-3">Hidden Answer</label>
            <div class="form-group">
                <label for="hidden_answer_difficulty">Difficulty</label>
                <div class="form-group">
                    <select id="hidden_answer_difficulty" name="hidden_answer_difficulty" class="custom-select">
                        <option {% if question.hidden_answer.difficulty is none %}selected=""{% endif %}>None</option>
                        <option {% if question.hidden_answer.difficulty == 1 %}selected=""{% endif %} value="1">Easy</option>
                        <option {% if question.hidden_answer.difficulty == 2 %}selected=""{% endif %} value="2">Medium</option>
                        <option {% if question.hidden_answer.difficulty == 3 %}selected=""{% endif %} value="3">Hard</option>
                    </select>
                </div>
            </div>
        {% endif %}
        <button id="save" name="save" type="submit" class="btn btn-primary">Save</button>
    </form>
{% endblock %}

{% block scripts %}
    <script>
    $("#add_wrong_answer").on("click", () => {

    })
    </script>
{% endblock %}