Как правильно вызвать модальное окно внутри другого модального в Bootstrap?

Есть модальное окно, например Авторизация, внутри него есть ссылка Регистрация при нажатии на которую должна закрываться текущая модалка и открываться модалка с регистарцией. Добился этого с помощью такой конструкции:
<a href="#" data-dismiss='modal' data-toggle="modal" data-target="#signup-modal">Регистрация</a>

но в данном случае появляется косяк: при переключении на второе модальное окно появляется скролл для основной страницы, из-за этого отсутствует возможность скроллить непосредственно модалку и она обрезается внизу.

Пример на CodePen
  • Вопрос задан
  • 401 просмотр
Решения вопроса 2
@Dvorakovski
Попробуй через JS.
.modal('hide') - этот метод прячет модалку (первую спрятать)
.modal('show') - этот показывает (вторую показать)
Тут подробно описано
Ответ написан
Комментировать
TARAKANhoy
@TARAKANhoy Автор вопроса
Решение:
// Modal
		function launchModal(id) {
			$('.modal').modal('hide');
			$('#'+id).modal('show');
			$('.body-wrapper').addClass('modal-open');
		}
		$('.close').click(function(){
			$('.body-wrapper').removeClass('modal-open');
		});

<a href="#" rel="nofollow" data-toggle="modal" onclick="launchModal('signup-modal')" class="modal-title__link">Регистрация</a>


P.S. вся страница должна быть в блоке .body-wrapper примерно так:
<body>
	<div class=""body-wrapper>
		//Тело страницы
	</div>
</body>


если вешать класс на body почему-то не срабатывает
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы