Spaces:

tddschn
/

mq-quiz

Runtime error

App Files Files Community

Pamela Fox commited on Sep 15, 2022

Commit

f85cf8e

1 Parent(s): 1dbd98a

Question display, CSS

Browse files

Files changed (5) hide show

quizzes/models.py +1 -33
quizzes/templates/quizzes/display.html +57 -20
quizzes/templates/quizzes/partial.html +5 -0
quizzes/urls.py +3 -3
quizzes/views.py +22 -8

quizzes/models.py CHANGED Viewed

@@ -32,17 +32,6 @@ class Question(models.Model):
   def __str__(self):
     return self.prompt
-  def display(self):
-    print(self.prompt)
-    self.answer.display()
-    user_answer = input()
-    if self.answer.is_correct(user_answer):
-      print("You got it!")
-      self.answer_status = 'correct'
-    else:
-      print(f"Sorry, it was: {self.answer.correct_answer}")
-      self.answer_status = 'incorrect'
 class Answer(models.Model):
   question = models.OneToOneField(
         Question,
@@ -65,12 +54,6 @@ class FreeTextAnswer(Answer):
       return user_answer.lower() == self.correct_answer.lower()
     return user_answer == self.correct_answer
-  def display(self):
-    if self.case_sensitive:
-      print("Type your answer in (capitalization matters!):")
-    else:
-      print("Type your answer in (don't worry about capitalization):")
 class MultipleChoiceAnswer(Answer):
   choices = fields.ArrayField(models.CharField(max_length=200, blank=True))
@@ -78,19 +61,4 @@ class MultipleChoiceAnswer(Answer):
     return f"{self.correct_answer} from {self.choices}"
   def is_correct(self, user_answer):
-    """Assumes user answer is number corresponding to answer."""
-    return self.choices[int(user_answer) - 1] == self.correct_answer
-  def is_correct(self, user_answer):
-    self.user_answer = int(user_answer)
-    self.user_answer -= 1
-    correct_index = self.choices.index(self.correct_answer)
-    if self.user_answer == correct_index:
-      return True
-    else:
-      return False
-  def display(self):
-    print("Type the number corresponding to the correct answer.")
-    for i in range(0, len(self.choices)):
-      print(f"{i + 1}. {self.choices[i]}")

   def __str__(self):
     return self.prompt
 class Answer(models.Model):
   question = models.OneToOneField(
         Question,
       return user_answer.lower() == self.correct_answer.lower()
     return user_answer == self.correct_answer
 class MultipleChoiceAnswer(Answer):
   choices = fields.ArrayField(models.CharField(max_length=200, blank=True))
     return f"{self.correct_answer} from {self.choices}"
   def is_correct(self, user_answer):
+    return user_answer == self.correct_answer

quizzes/templates/quizzes/display.html CHANGED Viewed

@@ -2,31 +2,68 @@
 <html>
 <head>
   <meta charset="utf-8">
-  <meta name="viewport" content="width=device-width">
-  <title>Quiz {{ quiz.id }}</title>
 </head>
 <body>
-    <h1>{{ quiz.name }}</h1>
-    <form action="{% url 'quizzes:grade' question.id %}" method="post">
         {% csrf_token %}
-    {% for question in quiz.question_set.all %}
-    <section>
-        <h3>{{ question.prompt }}</h3>
-        {% if question.freetextanswer %}
-        <input type="text" name="{{ question.pk }}">
-        {% else %}
-        {% for choice in question.multiplechoiceanswer.choices %}
-        <label>
-            <input type="radio" name="{{ question.pk }}" value="{{ choice }}">
-            {{ choice}}
-        </label>
-        {% endfor %}
-        {% endif %}
     </section>
-    {% endfor %}
-    <button type="submit">Check answers</button>
-</form>
 </body>
 </html>

 <html>
 <head>
   <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>Quiz: {{ quiz.name }}</title>
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">
 </head>
 <body>
+    <div class="container">
+    <h1>Quiz: {{ quiz.name }}</h1>
+    <section class="bg-warning" style="padding:12px">
+    <form id="question-form" action="{% url 'quizzes:grade_question' question.id %}" method="post">
         {% csrf_token %}
+        <fieldset class="form-group">
+            <legend>{{ question.prompt }}</legend>
+            {% if question.freetextanswer %}
+            <div class="form-group">
+            <label for="answer">
+            {% if question.freetextanswer.case_sensitive %}
+            Type your answer in (capitalization matters!):
+            {% else %}
+            Type your answer in (don't worry about capitalization):
+            {% endif %}
+            </label>
+            <input type="text" name="answer" class="form-control">
+            </div>
+            {% else %}
+            {% for choice in question.multiplechoiceanswer.choices %}
+            <div class="radio">
+            <label>
+                <input type="radio" name="answer" value="{{ choice }}">
+                {{ choice}}
+            </label>
+            </div>
+            {% endfor %}
+            {% endif %}
+        </fieldset>
+        <button type="submit" class="btn btn-primary">Check answers</button>
+    </form>
+    <div id="question-feedback" style="margin-top:16px">
+    </div>
     </section>
+    {% if next_question %}
+    <div style="margin-top:12px; font-size:16px">
+    <a href="{% url 'quizzes:display_question' quiz.id next_question.id %}">→ Next question</a>
+    </div>
+    {% endif %}
+    </div>
+    <script>
+    const form = document.getElementById("question-form");
+    form.addEventListener("submit", (e) => {
+        e.preventDefault();
+        fetch(form.action, {method:'post', body: new FormData(form)})
+            .then((response) => response.text())
+            .then(text => {
+                document.getElementById("question-feedback").innerHTML = text;
+            });
+    });
+    </script>
 </body>
 </html>

quizzes/templates/quizzes/partial.html ADDED Viewed

	@@ -0,0 +1,5 @@

+{% if is_correct %}
+✅ You got it!
+{% else %}
+❌ Sorry! The correct answer is {{ correct_answer }}
+{% endif %}

quizzes/urls.py CHANGED Viewed

@@ -6,7 +6,7 @@ app_name = 'quizzes'
 urlpatterns = [
     path('', views.index, name='index'),
-    path('<int:quiz_id>/', views.display, name='display'),
-    path('<int:quiz_id>/grade/', views.grade, name='grade'),
 ]

 urlpatterns = [
     path('', views.index, name='index'),
+    path('<int:quiz_id>/', views.display_quiz, name='display_quiz'),
+    path('<int:quiz_id>/questions/<int:question_id>', views.display_question, name='display_question'),
+    path('questions/<int:question_id>/grade/', views.grade_question, name='grade_question'),
 ]

quizzes/views.py CHANGED Viewed

@@ -1,18 +1,32 @@
-from django.shortcuts import get_object_or_404,render
-from .models import Quiz
 def index(request):
     quiz_list = Quiz.objects.all()
     context = {'quiz_list': quiz_list}
     return render(request, 'quizzes/index.html', context)
-def display(request, quiz_id):
     quiz = get_object_or_404(Quiz, pk=quiz_id)
-    return render(request, 'quizzes/display.html', {'quiz': quiz})
-def grade(request, quiz_id):
     quiz = get_object_or_404(Quiz, pk=quiz_id)
-    return render(request, 'quizzes/display.html', {'quiz': quiz})

+from django.shortcuts import get_object_or_404,render, redirect
+from django.urls import reverse
+from .models import Quiz, Question
 def index(request):
     quiz_list = Quiz.objects.all()
     context = {'quiz_list': quiz_list}
     return render(request, 'quizzes/index.html', context)
+def display_quiz(request, quiz_id):
     quiz = get_object_or_404(Quiz, pk=quiz_id)
+    question = quiz.question_set.first()
+    return redirect(reverse('quizzes:display_question', kwargs={'quiz_id': quiz_id, 'question_id': question.pk}))
+def display_question(request, quiz_id, question_id):
     quiz = get_object_or_404(Quiz, pk=quiz_id)
+    # fetch ALL of the questions to find current and next question
+    questions = quiz.question_set.all()
+    current_question, next_question = None, None
+    for ind, question in enumerate(questions):
+        if question.pk == question_id:
+            current_question = question
+            if ind != len(questions) - 1:
+                next_question = questions[ind + 1]
+    return render(request, 'quizzes/display.html', {'quiz': quiz, 'question': current_question, 'next_question': next_question})
+def grade_question(request, question_id):
+    question = get_object_or_404(Question, pk=question_id)
+    answer = getattr(question, 'multiplechoiceanswer', None) or getattr(question, 'freetextanswer')
+    is_correct = answer.is_correct(request.POST.get('answer'))
+    return render(request, 'quizzes/partial.html', {'is_correct': is_correct, 'correct_answer': answer.correct_answer})