Enhance QuestionReviewForm by adding autofocus to comment field and improve status button rendering with active state
This commit is contained in:
Ross
+1
-1
@@ -842,7 +842,7 @@ class QuestionReviewForm(ModelForm):
|
||||
widgets = {
|
||||
# Use Bootstrap "btn-check" inputs so we can style labels as button toggles
|
||||
"status": RadioSelect(attrs={"class": "btn-check", "autocomplete": "off"}),
|
||||
"comment": Textarea(attrs={"class": "form-control form-control-sm", "placeholder": "Comment (optional)", "rows": 2}),
|
||||
"comment": Textarea(attrs={"class": "form-control form-control-sm", "placeholder": "Comment (optional)", "rows": 2, "autofocus": "autofocus"}),
|
||||
}
|
||||
|
||||
def __init__(self, *args, **kwargs):
|
||||
|
||||
@@ -9,21 +9,12 @@
|
||||
<div class="col-auto">
|
||||
<label class="form-label mb-1">Status</label>
|
||||
<div>
|
||||
{% for radio in form.status %}
|
||||
{% with current_status=form.status.value %}
|
||||
{% for radio in form.status %}
|
||||
{% comment %} Render colored button for each choice by checking value {% endcomment %}
|
||||
{{ radio.tag }}
|
||||
{% if radio.choice_value == 'AC' %}
|
||||
<label class="btn btn-outline-success me-1 mb-1" for="{{ radio.id_for_label }}">{{ radio.choice_label }}</label>
|
||||
{% elif radio.choice_value == 'OD' %}
|
||||
<label class="btn btn-outline-secondary me-1 mb-1" for="{{ radio.id_for_label }}">{{ radio.choice_label }}</label>
|
||||
{% elif radio.choice_value == 'ER' %}
|
||||
<label class="btn btn-outline-warning me-1 mb-1" for="{{ radio.id_for_label }}">{{ radio.choice_label }}</label>
|
||||
{% elif radio.choice_value == 'RJ' %}
|
||||
<label class="btn btn-outline-danger me-1 mb-1" for="{{ radio.id_for_label }}">{{ radio.choice_label }}</label>
|
||||
{% else %}
|
||||
<label class="btn btn-outline-primary me-1 mb-1" for="{{ radio.id_for_label }}">{{ radio.choice_label }}</label>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
<label class="btn btn-outline-primary me-1 mb-1{% if radio.choice_value == current_status %} active{% endif %}" for="{{ radio.id_for_label }}">{{ radio.choice_label }}</label>
|
||||
{% endfor %}
|
||||
{% endwith %}
|
||||
</div>
|
||||
{% if form.status.errors %}
|
||||
<div class="invalid-feedback d-block">{{ form.status.errors|join:", " }}</div>
|
||||
|
||||
@@ -5,46 +5,52 @@
|
||||
{% endblock %}
|
||||
|
||||
{% block navigation %}
|
||||
<nav class="navbar navbar-expand-lg navbar-dark submenu">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand" href="{% url 'sbas:index' %}">SBAs</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse">
|
||||
<ul class="navbar-nav">
|
||||
{% if request.user.is_authenticated %}
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="{% url 'sbas:exam_list' %}"><i class="bi bi-mortarboard"></i> Exams</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="{% url 'sbas:question_view' %}"><i class="bi bi-question-circle"></i> Questions</a>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" data-bs-toggle="dropdown" href="#" role="button" aria-expanded="false"><i class="bi bi-file-earmark-plus"></i> Create</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a class="dropdown-item" href="{% url 'sbas:exam_create' %}" title="Create a new exam"><i class="bi bi-mortarboard"></i> Exam</a></li>
|
||||
<li><a class="dropdown-item" href="{% url 'sbas:question_create' %}" title="Create a new question"><i class="bi bi-question-circle"></i> Question</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item-dropdown">
|
||||
<a class="nav-link dropdown-toggle" data-bs-toggle="dropdown" href="#" role="button" aria-expanded="false"><i class="bi bi-gear"></i> LLM</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a class="dropdown-item" href="{% url 'sbas:llm_prompt_view' %}" title="Generate questions using LLM"><i class="bi bi-robot"></i> LLM prompt</a></li>
|
||||
<li><a class="dropdown-item" href="{% url 'sbas:import_llm_questions' %}" title="Import questions using LLM"><i class="bi bi-upload"></i> Import Questions</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
{% if request.user.is_superuser %}
|
||||
<nav class="navbar navbar-expand-lg navbar-dark submenu">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand" href="{% url 'sbas:index' %}">SBAs</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse">
|
||||
<ul class="navbar-nav">
|
||||
{% if request.user.is_authenticated %}
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="{% url 'sbas:user_answer_table_view' %}" title="User answers">Answers</a>
|
||||
<a class="nav-link" href="{% url 'sbas:exam_list' %}"><i class="bi bi-mortarboard"></i> Exams</a>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" id="sbasQuestionsDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
|
||||
<i class="bi bi-question-circle"></i> Questions
|
||||
</a>
|
||||
<ul class="dropdown-menu" aria-labelledby="sbasQuestionsDropdown">
|
||||
<li><a class="dropdown-item" href="{% url 'sbas:question_view' %}"><i class="bi bi-list-ul"></i> All Questions</a></li>
|
||||
<!-- Additional items can be added here -->
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" data-bs-toggle="dropdown" href="#" role="button" aria-expanded="false"><i class="bi bi-file-earmark-plus"></i> Create</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a class="dropdown-item" href="{% url 'sbas:exam_create' %}" title="Create a new exam"><i class="bi bi-mortarboard"></i> Exam</a></li>
|
||||
<li><a class="dropdown-item" href="{% url 'sbas:question_create' %}" title="Create a new question"><i class="bi bi-question-circle"></i> Question</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" id="sbasLLMDropdown" data-bs-toggle="dropdown" href="#" role="button" aria-expanded="false"><i class="bi bi-gear"></i> LLM</a>
|
||||
<ul class="dropdown-menu" aria-labelledby="sbasLLMDropdown">
|
||||
<li><a class="dropdown-item" href="{% url 'sbas:llm_prompt_view' %}" title="Generate questions using LLM"><i class="bi bi-robot"></i> LLM prompt</a></li>
|
||||
<li><a class="dropdown-item" href="{% url 'sbas:import_llm_questions' %}" title="Import questions using LLM"><i class="bi bi-upload"></i> Import Questions</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
{% if request.user.is_superuser %}
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="{% url 'sbas:user_answer_table_view' %}" title="User answers">Answers</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</ul>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</nav>
|
||||
{% endblock %}
|
||||
{% block content %}
|
||||
{% endblock %}
|
||||
|
||||
Reference in New Issue
Block a user