Better list tables

apps/family/tables.py

@@ -3,6 +3,7 @@
 
 import django_tables2 as tables
 from django_tables2 import A
+from django.urls import reverse
 
 from .models import Family, Challenge, FamilyMembership
 
@@ -11,11 +12,6 @@ class FamilyTable(tables.Table):
     """
     List all families
     """
-    name = tables.LinkColumn(
-        "family:family_detail",
-        args=[A("pk")],
-    )
-
     class Meta:
         attrs = {
             'class': 'table table-condensed table-striped table-hover'
@@ -24,17 +20,17 @@ class FamilyTable(tables.Table):
         template_name = 'django_tables2/bootstrap4.html'
         fields = ('name', 'score', 'rank',)
         order_by = ('rank',)
+        row_attrs = {
+            'class': 'table-row',
+            'data-href': lambda record: reverse('family:family_detail', args=[record.pk]),
+            'style': 'cursor:pointer',
+        }
 
 
 class ChallengeTable(tables.Table):
     """
     List all challenges
     """
-    name = tables.LinkColumn(
-        "family:challenge_detail",
-        args=[A("pk")],
-    )
-
     class Meta:
         attrs = {
             'class': 'table table-condensed table-striped table-hover'
@@ -43,6 +39,11 @@ class ChallengeTable(tables.Table):
         model = Challenge
         template_name = 'django_tables2/bootstrap4.html'
         fields = ('name', 'description', 'points',)
+        row_attrs = {
+            'class': 'table-row',
+            'data-href': lambda record: reverse('family:challenge_detail', args=[record.pk]),
+            'style': 'cursor:pointer',
+        }
 
 
 class FamilyMembershipTable(tables.Table):

apps/family/templates/family/challenge_list.html

@@ -28,3 +28,10 @@ SPDX-License-Identifier: GPL-3.0-or-later
 </div>
 {% endblock %}
 
+{% block extrajavascript %}
+<script type="text/javascript">
+    $(".table-row").click(function () {
+            window.document.location = $(this).data("href");
+        });
+</script>
+{% endblock %}

apps/family/templates/family/family_list.html

@@ -26,5 +26,13 @@ SPDX-License-Identifier: GPL-3.0-or-later
     </h3>
     {% render_table table %}
 </div>
+
 {% endblock %}
 
+{% block extrajavascript %}
+<script type="text/javascript">
+    $(".table-row").click(function () {
+            window.document.location = $(this).data("href");
+        });
+</script>
+{% endblock %}