How to Resolve Multiple Modal Dialog Scrollbar in Bootstrap V.3.3.5

Programming tutorial – seegatesite will share about how to resolve multiple modal dialog scrollbar in bootstrap v.3.3.5. Using multiple modal dialog in bootstrap V3.3.5 different with old version bootstrap V3.0.0.

The multiple modal dialog problem in bootstrap V3.3.5 exist when we launched the first modal dialog, the scrollbar in the right working well but after we launch the second modal dialog, and close it, the scrollbar disappears.

You can see the bootstrap V3.0.0 work perfectly in below demo

modal dialog with bootstrap v.3.0.0

But, in bootstrap v.3.3.5 there problem exists

modal dialog with bootstrap v.3.3.5

I deadlocked with these issues, but someone from stackoverflow give me some trick to resolve the bootstrap V3.3.5 bug. Add this code below to your javascript file to resolve multiple modal dialog problem in Bootstrap V3.3.5. Read here for more detail

$("#second-modal-dialog").on('', function (event) {
  if ($('.modal:visible').length) //check if any modal is open
    $('body').addClass('modal-open');//add class to body

Change second-modal-dialog with your second modal dialog id

Thus my article about how to resolve multiple modal dialog scrollbar in bootstrap V.3.3.5 , hope useful đŸ™‚

The following two tabs change content below.
This site is a personal Blog of Sigit Prasetya Nugroho, a Desktop developer and freelance web developer working in PHP, MySQL, WordPress.

Leave a Comment

Your email address will not be published.

Time limit is exhausted. Please reload CAPTCHA.