Menu
I'm in need of a method to load dynamic content that can change at any time. According to the Bootstrap documentation
<a data-toggle="modal" href="remote.htm" data-target="#modal">Click me</a>is making use of the jQuerys' .load only loading the content once. It injects the content in the modal-content div. As previously stated the content of this modal can be changed at any given time and therefore I need a different method. Any ideas?
TL;DR - I'm looking for a method that will load dynamic content (remote) every time the modal opens instead of once (default Bootstrap modal).
485
Load Dynamic Content from Database in Bootstrap ModalBy clicking the Open Modal ( . openBtn ) button, the dynamic content is loaded from another PHP file ( getContent. php ) based on the ID and shows on the modal popup ( #myModal ).
const modal = document. createElement('div'); modal. classList. add('modal'); modal.id = 'modal'; modal.
Modals are built with HTML, CSS, and JavaScript. They're positioned over everything else in the document and remove scroll from the <body> so that modal content scrolls instead. Clicking on the modal “backdrop” will automatically close the modal. Bootstrap only supports one modal window at a time.
Bootstrap 5 Modal component. Responsive popup window with Bootstrap 5. Examples of with image, modal position i.e. center, z-index usage, modal fade animation, backdrop usage, modal size & more. Modal is a responsive popup used to display extra content.
this guy has a dirty but working solution: http://www.whiletrue.it/how-to-update-the-content-of-a-modal-in-twitter-bootstrap/
<a data-toggle="modal" href="remote.html" data-target="#modal">Click me</a>
becomes:
<a href="javascript:$('#modal .modal-body').load('remote.html',function(e){$('#modal').modal('show');});">Click me</a>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
