move modal window

templates/tickets/ticket_detail.html

@@ -71,6 +71,33 @@
             <button id="ticket-change-status-btn" class="btn btn-outline-secondary" data-bs-toggle="modal" data-bs-target="#ticket-change-status-modal">Change</button>
           </div>
         </form>
+
+        <!--ticket change status-->
+        <div class="modal fade" id="ticket-change-status-modal" tabindex="-1">
+          <div class="modal-dialog modal-dialog-centered">
+            <div class="modal-content">
+              <div class="modal-header">
+                <h1 class="modal-title fs-5">
+                  <i class="fa-solid fa-trash-can pe-1"></i>
+                  Change Status
+                </h1>
+              </div>
+              <div class="modal-body">
+                Are you sure you want to change the status of the ticket "{{ ticket.title }}" from <b>{{ ticket.get_status_display }}</b> to <b id="selectedStatusOption"></b>?
+              </div>
+              <div class="modal-footer">
+                <button type="button" class="btn btn-primary" data-bs-dismiss="modal">
+                  <i class="fa-solid fa-xmark pe-1"></i>
+                  Close
+                </button>
+                <button form="ticket-change-status-form" class="btn btn-outline-primary" type="submit">
+                  <i class="fa-solid fa-check pe-1"></i>
+                  Confirm
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
       {% else %}
         <p class="my-3">No available statuses</p>
       {% endif %}
@@ -143,33 +170,6 @@
             </div>
           </div>
         </div>
-
-        <!--ticket change status-->
-        <div class="modal fade" id="ticket-change-status-modal" tabindex="-1">
-          <div class="modal-dialog modal-dialog-centered">
-            <div class="modal-content">
-              <div class="modal-header">
-                <h1 class="modal-title fs-5">
-                  <i class="fa-solid fa-trash-can pe-1"></i>
-                  Change Status
-                </h1>
-              </div>
-              <div class="modal-body">
-                Are you sure you want to change the status of the ticket "{{ ticket.title }}" from <b>{{ ticket.get_status_display }}</b> to <b id="selectedStatusOption"></b>?
-              </div>
-              <div class="modal-footer">
-                <button type="button" class="btn btn-primary" data-bs-dismiss="modal">
-                  <i class="fa-solid fa-xmark pe-1"></i>
-                  Close
-                </button>
-                <button form="ticket-change-status-form" class="btn btn-outline-primary" type="submit">
-                  <i class="fa-solid fa-check pe-1"></i>
-                  Confirm
-                </button>
-              </div>
-            </div>
-          </div>
-        </div>
       {% endif %}
     </div>
   </div>