Задать вопрос
TARAKANhoy
@TARAKANhoy
bootstrap

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

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

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

Пример на CodePen
  • Вопрос задан
  • 424 просмотра
Комментировать
Подписаться 1 Оценить Комментировать
Решения вопроса 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 почему-то не срабатывает
Ответ написан
Комментировать
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

Похожие вопросы
Вакансии с Хабр Карьеры
Ведущий разработчиĸ (FullStack) для разработки международного стартапа
ClickStar • Москва
от 350 000 до 500 000 ₽
Системный Аналитик 1С
Wanted. • Москва
До 260 000 ₽
Ведущий программист 1С
Автомакон
от 250 000 до 400 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Отредактировать картинку и сделать с ней инфографику
16 нояб. 2024, в 22:54
100 руб./за проект
Моделирование очередей посетителей общепита на Unity
16 нояб. 2024, в 22:40
3000 руб./за проект
Рефакторинг и доработка существующего приложения на Flutter
16 нояб. 2024, в 21:46
300000 руб./за проект
Ещё заказы