Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 01.06.2018, 11:25
Аспирант
Отправить личное сообщение для Jimmi Посмотреть профиль Найти все сообщения от Jimmi
 
Регистрация: 28.02.2014
Сообщений: 53

Открыть страницу обработки формы в модальном окне
Как открыть страницу обработки формы (находящуюся в значении action) в модальном окне?

С помощью формы пользователь делает выборку определенных услуг. Нажимает на кнопку "Отправить" и отправляется на страницу /action.php, где и видит результат выборки. Так вот нужно, чтобы результат появлялся без перезагрузки, в модальном окне, а не на внешней странице.

Последний раз редактировалось Jimmi, 01.06.2018 в 12:11.
Ответить с цитированием
  #2 (permalink)  
Старый 01.06.2018, 11:44
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,227

Сообщение от Jimmi
в модальном окне?
Что ты понимаешь под "модальным окном"?

Поскольку клиентский скрипт может использовать ограниченный набор модальных окон. Такие как:
alert('Test');
confirm('Test');
prompt('Test');
Ответить с цитированием
  #3 (permalink)  
Старый 01.06.2018, 12:05
Аспирант
Отправить личное сообщение для Jimmi Посмотреть профиль Найти все сообщения от Jimmi
 
Регистрация: 28.02.2014
Сообщений: 53

Сообщение от ksa Посмотреть сообщение
Что ты понимаешь под "модальным окном"?

Поскольку клиентский скрипт может использовать ограниченный набор модальных окон. Такие как:
alert('Test');
confirm('Test');
prompt('Test');
Под модальным окном я подразумеваю медленно всплывающую область, с возможным затемнением заднего фона. Но это не обязательно.

Последний раз редактировалось Jimmi, 01.06.2018 в 12:08.
Ответить с цитированием
  #4 (permalink)  
Старый 01.06.2018, 13:02
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

ksa,
есть два модальных окна, которые могут гораздо большее, но как всегда - поддержка только IE.
Ответить с цитированием
  #5 (permalink)  
Старый 01.06.2018, 13:28
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,227

Сообщение от laimas
но как всегда - поддержка только IE
Потому я про них и не писал...
Ответить с цитированием
  #6 (permalink)  
Старый 01.06.2018, 13:32
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,227

Сообщение от Jimmi
Под модальным окном я подразумеваю медленно всплывающую область, с возможным затемнением заднего фона. Но это не обязательно.
Ты описываешь некую комбинацию тех же ДИВов...

Иными словами тебе нужно прочитать некий контент в ДИВ.
Тут может помочь такой метод
https://jquery-docs.ru/load/

Т.е. ты читаешь action у формы, формируешь УРЛ из данных формы. И вызываешь правильно этот метод.
Сервер читает данные, формирует контент, который потом отобразится в указанном ДИВе.
Ответить с цитированием
  #7 (permalink)  
Старый 05.06.2018, 14:06
Аспирант
Отправить личное сообщение для Jimmi Посмотреть профиль Найти все сообщения от Jimmi
 
Регистрация: 28.02.2014
Сообщений: 53

Сообщение от ksa Посмотреть сообщение
Ты описываешь некую комбинацию тех же ДИВов...

Иными словами тебе нужно прочитать некий контент в ДИВ.
Тут может помочь такой метод
https://jquery-docs.ru/load/

Т.е. ты читаешь action у формы, формируешь УРЛ из данных формы. И вызываешь правильно этот метод.
Сервер читает данные, формирует контент, который потом отобразится в указанном ДИВе.
Модальное окнo есть, но оно реагирует на тег <a href> (пример прилагаю)
. Теперь нужно его как-то научить реагировать на 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>
Ответить с цитированием
  #8 (permalink)  
Старый 08.06.2018, 15:07
Профессор
Отправить личное сообщение для Manyasha Посмотреть профиль Найти все сообщения от Manyasha
 
Регистрация: 21.09.2015
Сообщений: 196

Jimmi,
попробуйте заменить 8-ю строчку на
$('form').submit( function(event){
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
открыть новую страницу в модальном окне maximamus Общие вопросы Javascript 2 09.12.2015 16:29
требуется помощь по установке Формы обратной связи в модальном окне. Bob11 Работа 0 13.11.2015 12:40
Динамическое создание iframe в Firefox mrbean11 Firefox/Mozilla 8 02.11.2012 21:23
Вопрос по реализации формы в простейшем модальном окне battrack jQuery 2 22.04.2012 13:46
в модальном окне не работает скрипт проверки формы necroms jQuery 1 11.03.2011 15:14