Add debugging for modal initialization issue
Added console logging to diagnose why Demo Credentials modal is not opening despite no visible errors. Changes: - Log button click event - Log Bootstrap availability check - Log modal element existence - Log fetch response status - Log content length after loading - Log modal instance creation - Check Bootstrap.Modal availability before use This will help identify whether the issue is with event binding, Bootstrap loading, fetch requests, or modal initialization. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -159,18 +159,35 @@
|
|||||||
|
|
||||||
newBtn.addEventListener('click', function(event) {
|
newBtn.addEventListener('click', function(event) {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
|
console.log('Demo Credentials button clicked');
|
||||||
|
console.log('Bootstrap available:', typeof bootstrap !== 'undefined');
|
||||||
|
console.log('Modal element:', modalElement);
|
||||||
|
|
||||||
fetch('<%= credentials_tutorials_path %>')
|
fetch('<%= credentials_tutorials_path %>')
|
||||||
.then(response => response.text())
|
.then(response => {
|
||||||
|
console.log('Fetch response status:', response.status);
|
||||||
|
return response.text();
|
||||||
|
})
|
||||||
.then(html => {
|
.then(html => {
|
||||||
|
console.log('Content loaded, length:', html.length);
|
||||||
document.getElementById('modal_content').innerHTML = html;
|
document.getElementById('modal_content').innerHTML = html;
|
||||||
const modal = new bootstrap.Modal(modalElement);
|
|
||||||
modal.show();
|
if (typeof bootstrap !== 'undefined' && bootstrap.Modal) {
|
||||||
|
const modal = new bootstrap.Modal(modalElement);
|
||||||
|
console.log('Modal instance created:', modal);
|
||||||
|
modal.show();
|
||||||
|
} else {
|
||||||
|
console.error('Bootstrap Modal not available');
|
||||||
|
}
|
||||||
})
|
})
|
||||||
.catch(error => {
|
.catch(error => {
|
||||||
console.error('Error loading credentials:', error);
|
console.error('Error loading credentials:', error);
|
||||||
document.getElementById('modal_content').innerHTML = '<p class="text-danger">Error loading credentials. Please try again.</p>';
|
document.getElementById('modal_content').innerHTML = '<p class="text-danger">Error loading credentials. Please try again.</p>';
|
||||||
const modal = new bootstrap.Modal(modalElement);
|
|
||||||
modal.show();
|
if (typeof bootstrap !== 'undefined' && bootstrap.Modal) {
|
||||||
|
const modal = new bootstrap.Modal(modalElement);
|
||||||
|
modal.show();
|
||||||
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user