From 844acfc8e66720f217872a8ab01710975927cfe7 Mon Sep 17 00:00:00 2001 From: Ken Johnson Date: Sun, 7 Dec 2025 22:16:24 +0000 Subject: [PATCH] Use proper Bootstrap 5 native modal API with initialization MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Bootstrap 5 removed jQuery plugin support, so .modal('show') doesn't work. Switch back to native Bootstrap 5 Modal API with proper initialization: - Dispose of any existing modal instance before creating new one - Create modal with explicit options (backdrop, keyboard, focus) - Add detailed console logging for each step This ensures the modal is properly initialized before showing. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude --- app/views/admin/get_all_users.html.erb | 23 ++++++++++++++++++++--- 1 file changed, 20 insertions(+), 3 deletions(-) diff --git a/app/views/admin/get_all_users.html.erb b/app/views/admin/get_all_users.html.erb index dc5f5a7..25afe4d 100755 --- a/app/views/admin/get_all_users.html.erb +++ b/app/views/admin/get_all_users.html.erb @@ -56,9 +56,26 @@ function openEditModal(id){ $("#editAcct .modal-content").load(link, function(response, status, xhr) { console.log('Load status:', status); if (status == "success") { - console.log('Showing modal with jQuery'); - // Use jQuery/Bootstrap method which handles initialization automatically - $('#editAcct').modal('show'); + console.log('Initializing Bootstrap 5 modal'); + var modalEl = document.getElementById('editAcct'); + + // Ensure any existing instance is disposed + var existingModal = bootstrap.Modal.getInstance(modalEl); + if (existingModal) { + existingModal.dispose(); + } + + // Create new modal with options + var modal = new bootstrap.Modal(modalEl, { + backdrop: true, + keyboard: true, + focus: true + }); + + console.log('Modal created, calling show()'); + modal.show(); + + console.log('Modal should be visible now'); } else { console.error('Failed to load modal content:', xhr.statusText); }