Открыть страницу обработки формы в модальном окне
Как открыть страницу обработки формы (находящуюся в значении action) в модальном окне?
С помощью формы пользователь делает выборку определенных услуг. Нажимает на кнопку "Отправить" и отправляется на страницу /action.php, где и видит результат выборки. Так вот нужно, чтобы результат появлялся без перезагрузки, в модальном окне, а не на внешней странице. |
Цитата:
Поскольку клиентский скрипт может использовать ограниченный набор модальных окон. Такие как: alert('Test'); confirm('Test'); prompt('Test'); |
Цитата:
|
ksa,
есть два модальных окна, которые могут гораздо большее, но как всегда - поддержка только IE. |
Цитата:
|
Цитата:
Иными словами тебе нужно прочитать некий контент в ДИВ. Тут может помочь такой метод https://jquery-docs.ru/load/ Т.е. ты читаешь action у формы, формируешь УРЛ из данных формы. И вызываешь правильно этот метод. Сервер читает данные, формирует контент, который потом отобразится в указанном ДИВе. |
Цитата:
. Теперь нужно его как-то научить реагировать на input или form <div id="modal_form5"> <span id="modal_close5">x</span> Содержимое модального окна </div> <div id="overlay5"></div> <script type="text/javascript"> $(document).ready(function() { // вся магия после загрузки страницы $('a#go5').click( function(event){ // ловим клик по ссылки с id="go" event.preventDefault(); // выключаем стандартную роль элемента $('#overlay5').fadeIn(300, // сначала плавно показываем темную подложку function(){ // после выполнения предъидущей анимации $('#modal_form5') .css('display', 'block') // убираем у модального окна display: none; .animate({opacity: 1, top: '50%'}, 200); // плавно прибавляем прозрачность одновременно со съезжанием вниз }); }); /* Закрытие модального окна, тут делаем то же самое но в обратном порядке */ $('#modal_close5, #overlay5').click( function(){ // ловим клик по крестику или подложке $('#modal_form5') .animate({opacity: 0, top: '35%'}, 200, // плавно меняем прозрачность на 0 и одновременно двигаем окно вверх function(){ // после анимации $(this).css('display', 'none'); // делаем ему display: none; $('#overlay5').fadeOut(300); // скрываем подложку } ); }); }); </script> |
Jimmi,
попробуйте заменить 8-ю строчку на $('form').submit( function(event){ |
Часовой пояс GMT +3, время: 10:36. |