Bootable download content via a remote URL, wait until the modal will fully download the content before displaying

Question

I can upload content via a remote URL in bootstrap modal, but the problem is that the modal window opens, but the content does not load.

After loading the content, the body of the modality is updated, and the height expands to match the contents of the modal.

However, I would like to display only modal content after the content has fully loaded, and possibly display an animated gif while loading the modal.

I looked through the documents, but I did not see anything about a possible callback after loading the modal. I was hoping I might save the modal until the callback was launched and showed it. How can i do this?

Answer 1

I got this thanks to the above comments. I saved the remote URLs for the anchor tags that trigger the popup using the data attribute ('data-href') with the anchors class name as "popup-links" using the following javascript:

$jq191('.popup-links').on( 'click', function( e ){ var remote= $jq191( this ).data( 'href' ); $jq191('.modal-body').load( remote, function( e ){ $jq191( '#myModal' ).modal( 'show' ); }); });