Как запустить reveal modal кнопкой submit?

Question

[Сергей]

Использую замечательный jquery-плагин "reveal modal" так, как написано в примере на сайте:

<div id="myModal" class="reveal-modal">
  Любое содержимое, любые теги, любая разметка
     <a class="close-reveal-modal">&#215;</a>
</div>

<a href="#" data-reveal-id="myModal" >Запуск</a>

Хочу запускать модальное окно не ссылкой, а кнопкой формы
Подскажите пожалуйста рабочий пример.

Answer 1

[Александр Вульф]

Думаю, также, но вместо ссылки использовать <input type='submit' />

Answer 2

[Илья]

На крайний случай можно сделать имитацию нажатия ссылки по кнопке, а саму ссылку спрятать:

$('.call-popup-button').on("click", function (e) {
	e.preventDefault();
	$('#call-popup-link').click();
})

Впрочем, не понимаю почему бы просто не перенести атрибут data-reveal-id на кнопку.

Answer 3

[Сергей]

Мне не нужна имитация нажатия, мне нужна сама кнопка submit. Ссылка с имитацией у меня есть на сайте, мне это сейчас не нужно.

<form Action="index.php" method="post" id="LoginForm" name="LoginForm">
<input type=submit value="Купить"  data-reveal-id="myModal" >
</form>

<div id="myModal" class="reveal-modal">
  Любое содержимое, любые теги, любая разметка
     <a class="close-reveal-modal">&#215;</a>
</div>

Не работает

Answer 4

[GreatRash]

Когда вы сабмитите форму, то страница перезагружается, соответственно модальное окно никогда не всплывёт. Чтобы его увидеть, вам придётся отменить событие submit. Т.е. сабмитить форму вам нужно будет уже из модального окна.

Нужно ли вам именно такое поведение непонятно. Поэтому предлагаю вам точнее описать нужное поведение.

Answer 5

[Сергей]

Правильно заданный вопрос - уже половина решения проблемы.
Вы гений!
Вчера ночью сидел и тупил, а ваш вопрос натолкнул меня на очень интересный обход моей проблемы.