Merge pull request #10233 from netbox-community/9665-rack-elevation-sorting

#9665 Rack Elevation Sorting Enhancements

netbox/dcim/views.py

@@ -589,10 +589,17 @@ class RackElevationListView(generic.ObjectListView):
         racks = filtersets.RackFilterSet(request.GET, self.queryset).qs
         total_count = racks.count()
 
-        # Determine ordering
-        reverse = bool(request.GET.get('reverse', False))
-        if reverse:
-            racks = racks.reverse()
+        ORDERING_CHOICES = {
+            'name': 'Name (A-Z)',
+            '-name': 'Name (Z-A)',
+            'facility_id': 'Facility ID (A-Z)',
+            '-facility_id': 'Facility ID (Z-A)',
+        }
+        sort = request.GET.get('sort', "name")
+        if sort not in ORDERING_CHOICES:
+            sort = 'name'
+
+        racks = racks.order_by(sort)
 
         # Pagination
         per_page = get_paginate_count(request)
@@ -614,7 +621,9 @@ class RackElevationListView(generic.ObjectListView):
             'paginator': paginator,
             'page': page,
             'total_count': total_count,
-            'reverse': reverse,
+            'sort': sort,
+            'sort_display_name': ORDERING_CHOICES[sort],
+            'sort_choices': ORDERING_CHOICES,
             'rack_face': rack_face,
             'filter_form': forms.RackElevationFilterForm(request.GET),
         })

netbox/templates/dcim/rack_elevation_list.html

@@ -18,9 +18,15 @@
                 <a href="{% url 'dcim:rack_elevation_list' %}{% querystring request face='front' %}" class="btn btn-outline-secondary{% if rack_face == 'front' %} active{% endif %}">Front</a>
                 <a href="{% url 'dcim:rack_elevation_list' %}{% querystring request face='rear' %}" class="btn btn-outline-secondary{% if rack_face == 'rear' %} active{% endif %}">Rear</a>
             </div>
-            <div class="btn-group btn-group-sm" role="group">
-                <a href="{% url 'dcim:rack_elevation_list' %}{% querystring request reverse=None %}" class="btn btn-outline-secondary{% if not reverse %} active{% endif %}">Normal</a>
-                <a href="{% url 'dcim:rack_elevation_list' %}{% querystring request reverse='true' %}" class="btn btn-outline-secondary{% if reverse %} active{% endif %}">Reversed</a>
+            <div class="dropdown">
+              <button type="button" class="btn btn-sm btn-outline-secondary dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                <i class="mdi mdi-sort"></i>&nbsp;Sort By {{ sort_display_name }}
+              </button>
+              <ul class="dropdown-menu dropdown-menu-end">
+                {% for sort_key, sort_display_name in sort_choices.items %}
+                  <li><a class="dropdown-item{% if sort == sort_key %} active{% endif %}" href="{% url 'dcim:rack_elevation_list' %}{% querystring request sort=sort_key %}">{{ sort_display_name }}</a></li>
+                {% endfor %}
+              </ul>
             </div>
         </div>
     </div>