When more than one modal is opened you might have noticed that after the latter modal loses its focus, the former modal loses its scrolling option, rather page’s body scrolls (if exists, otherwise no scrollbar!). There is a quick fix for this:
Just add:
$('.modal').on('hidden.bs.modal', function (e) { $('body').addClass('modal-open'); });
credits: @simonalmar
in your global script file.
Still if you face issue when multiple modals are simultaneously open, adding this would fix:
$('.modal').on("hidden.bs.modal", function (e) { if($('.modal:visible').length) { $('.modal-backdrop').first().css('z-index', parseInt($('.modal:visible').last().css('z-index')) - 10); $('body').addClass('modal-open'); } }).on("show.bs.modal", function (e) { if($('.modal:visible').length) { $('.modal-backdrop.in').first().css('z-index', parseInt($('.modal:visible').last().css('z-index')) + 10); $(this).css('z-index', parseInt($('.modal-backdrop.in').first().css('z-index')) + 10); } });
credits: @FireSBurnsmuP
thank you !!!!
LikeLike
Thanks save my day after hours of looking for a solution for this issue. I’m opening and closing like 5 modal windows in sequence one after another. =)
LikeLike
Glad that you resolved it!
LikeLike
Thank you, for giving me a perfect solution and problem solving
LikeLiked by 1 person