From c7850b586b37c4d2784c8513e7f04e1a7ca7d5e4 Mon Sep 17 00:00:00 2001
From: Jeremy Stretch <jstretch@netboxlabs.com>
Date: Mon, 13 May 2024 16:00:07 -0400
Subject: [PATCH] Fixes #16101: Fix initial loading of pagination widget for
 dynamic object tables

---
 netbox/templates/htmx/table.html              | 20 ++++++++++---------
 netbox/templates/inc/paginator.html           |  3 ++-
 netbox/templates/inc/table_htmx.html          |  2 +-
 .../templates/builtins/htmx_table.html        |  2 +-
 4 files changed, 15 insertions(+), 12 deletions(-)

diff --git a/netbox/templates/htmx/table.html b/netbox/templates/htmx/table.html
index 155e7f9c3..f93c86a34 100644
--- a/netbox/templates/htmx/table.html
+++ b/netbox/templates/htmx/table.html
@@ -2,15 +2,17 @@
 {% load helpers %}
 {% load render_table from django_tables2 %}
 
-{% with preferences|get_key:"pagination.placement" as paginator_placement %}
-  {% if paginator_placement == 'top' or paginator_placement == 'both' %}
-    {% include 'inc/paginator.html' with htmx=True table=table paginator=table.paginator page=table.page placement='top' %}
-  {% endif %}
-  {% render_table table 'inc/table_htmx.html' %}
-  {% if paginator_placement != 'top' %}
-    {% include 'inc/paginator.html' with htmx=True table=table paginator=table.paginator page=table.page %}
-  {% endif %}
-{% endwith %}
+<div class="htmx-container table-responsive">
+  {% with preferences|get_key:"pagination.placement" as paginator_placement %}
+    {% if paginator_placement == 'top' or paginator_placement == 'both' %}
+      {% include 'inc/paginator.html' with htmx=True table=table paginator=table.paginator page=table.page placement='top' %}
+    {% endif %}
+    {% render_table table 'inc/table_htmx.html' %}
+    {% if paginator_placement != 'top' %}
+      {% include 'inc/paginator.html' with htmx=True table=table paginator=table.paginator page=table.page %}
+    {% endif %}
+  {% endwith %}
+</div>
 
 {# Include the updated object count for display elsewhere on the page #}
 <div class="d-none" hx-swap-oob="innerHTML:.total-object-count">{{ table.rows|length }}</div>
diff --git a/netbox/templates/inc/paginator.html b/netbox/templates/inc/paginator.html
index 5c94d9569..122cdf050 100644
--- a/netbox/templates/inc/paginator.html
+++ b/netbox/templates/inc/paginator.html
@@ -5,7 +5,8 @@
   <div
       class="d-flex justify-content-between align-items-center border-{% if placement == 'top' %}bottom{% else %}top{% endif %} p-2"
       hx-target="closest .htmx-container"
-      hx-disinherit="hx-select hx-swap"
+      hx-disinherit="hx-select"
+      hx-swap="outerHTML"
       {% if not table.embedded %}hx-push-url="true"{% endif %}
   >
 
diff --git a/netbox/templates/inc/table_htmx.html b/netbox/templates/inc/table_htmx.html
index 06d3d9b72..446a77643 100644
--- a/netbox/templates/inc/table_htmx.html
+++ b/netbox/templates/inc/table_htmx.html
@@ -1,5 +1,5 @@
 {% load django_tables2 %}
-<table{% if table.attrs %} {{ table.attrs.as_html }}{% endif %} hx-disinherit="hx-target hx-select hx-swap">
+<table{% if table.attrs %} {{ table.attrs.as_html }}{% endif %} hx-disinherit="hx-target hx-select" hx-swap="outerHTML">
   {% if table.show_header %}
     <thead
         hx-target="closest .htmx-container"
diff --git a/netbox/utilities/templates/builtins/htmx_table.html b/netbox/utilities/templates/builtins/htmx_table.html
index 6a7959573..b3ceed2c7 100644
--- a/netbox/utilities/templates/builtins/htmx_table.html
+++ b/netbox/utilities/templates/builtins/htmx_table.html
@@ -1,5 +1,5 @@
 <div class="htmx-container table-responsive"
   hx-get="{% url viewname %}{% if url_params %}?{{ url_params.urlencode }}{% endif %}"
   hx-target="this"
-  hx-trigger="load" hx-select="table" hx-swap="innerHTML"
+  hx-trigger="load" hx-select=".htmx-container" hx-swap="outerHTML"
 ></div>