.

longs/templates/longs/question_view.html

@@ -13,44 +13,9 @@
     <input class="btn btn-primary btn-sm mt-1 mb-1" type="submit" />
 </form>
 </div>
-<button id="delete-all-button">Delete all</button>
 {% render_table table %}
 
 {% endblock %}
 
 {% block js %}
-<script>
-    $(document).ready(function () {
-        //$("thead input:checked").each((n, el) => {
-
-        answer_ids = [];
-        $("tbody input:checked").each((n, el) => {
-            answer_ids.push(el.value);
-        })
-        $("#delete-all-button").on("click", function () {
-            $.ajax({
-                    url: "{% url 'longs:user_answer_delete_multiple' %}",
-                    data: {
-                        csrfmiddlewaretoken: "{{ csrf_token }}",
-                        answer_ids: JSON.stringify(answer_ids) // true if checked else false
-                    },
-                    type: "POST",
-                    dataType: "json",
-                })
-                // $.ajax().done(), $.ajax().fail(), $ajax().always() are upto you. Add/change accordingly
-                .done(function (data) {
-                    console.log(data);
-
-                    if (data.status == "success") {
-                        toastr.info('Deleted.')
-                    }
-                    // show some message according to the response. 
-                    // For eg. A message box showing that the status has been changed
-                })
-                .always(function () {
-                    console.log('[Done]');
-                })
-        })
-    });
-</script>
 {% endblock %}

longs/templates/longs/user_answer_question_view.html

@@ -0,0 +1,59 @@
+{% extends 'longs/base.html' %}
+
+{% load render_table from django_tables2 %}
+{% block css %}
+{% endblock %}
+
+{% block content %}
+
+<div id="view-filter-options">
+    <h3>Filter User Answers</h3>
+<form action="" method="get">
+    {{ filter.form }}
+    <input class="btn btn-primary btn-sm mt-1 mb-1" type="submit" />
+</form>
+</div>
+{% render_table table %}
+<button id="delete-selected-button">Delete selected answers</button>
+
+{% endblock %}
+
+{% block js %}
+<script>
+    $(document).ready(function () {
+        $("table thead th input").click((e) => {
+            let status = e.currentTarget.checked; console.log(status, $("table tbody input")); $("table tbody input").prop("checked", status);
+        })
+        //$("thead input:checked").each((n, el) => {
+
+        answer_ids = [];
+        $("tbody input:checked").each((n, el) => {
+            answer_ids.push(el.value);
+        })
+        $("#delete-selected-button").on("click", function () {
+            $.ajax({
+                    url: "{% url 'longs:user_answer_delete_multiple' %}",
+                    data: {
+                        csrfmiddlewaretoken: "{{ csrf_token }}",
+                        answer_ids: JSON.stringify(answer_ids) // true if checked else false
+                    },
+                    type: "POST",
+                    dataType: "json",
+                })
+                // $.ajax().done(), $.ajax().fail(), $ajax().always() are upto you. Add/change accordingly
+                .done(function (data) {
+                    console.log(data);
+
+                    if (data.status == "success") {
+                        toastr.info('Deleted.')
+                    }
+                    // show some message according to the response. 
+                    // For eg. A message box showing that the status has been changed
+                })
+                .always(function () {
+                    console.log('[Done]');
+                })
+        })
+    });
+</script>
+{% endblock %}

longs/views.py

@@ -1047,7 +1047,7 @@ class UserAnswerView(LoginRequiredMixin, DetailView):
 class UserAnswerTableView(LoginRequiredMixin, SingleTableMixin, FilterView):
     model = CidUserAnswer
     table_class = UserAnswerTable
-    template_name = "longs/question_view.html"
+    template_name = "longs/user_answer_question_view.html"
 
     filterset_class = UserAnswerFilter