Меню
Что нового?

Сабмит данных во фрейм Fancybox

be4ok

Новичок
Здравствуйте!
У меня такая проблема, над которой я уже бьюсь 2-й день - и всё безрезультатно.

На странице сайта есть форма с текстовым полем и радио чеками. Данные с формы передаются методом post на страницу send.php обычной кнопочкой сабмит (в теге form прописан action). Вопрос в том, как сделать так, чтобы после нажатия кнопки, send.php не загружался в новой странице, а открывался во фрейме fancybox на jQwery.
Fancybox уже подключен. Он вызывается по ссылке следующего типа: <a href="send.php?iframe class="zoom"></a>.
Собственно, загвоздка именно в том, что нужно обязательно указать класс zoom и параметр iframe для вывода фрейма.
Помогите, пожалуйста!

ЗЫ. В программировании я новичок.
 
Redjik

Redjik

Джедай-мастер
У меня есть готовый ответ, но сначала скажи, какое отношение ты имеешь к сайту, который делаешь?
 
~WR~

~WR~

Новичок
PHP: 
$('#form').submit(function()
{
    $t = $(this);

    $.post($t.attr('action'), $t.serialize(), function(response)
    {
        $.fancybox(response);
    });

    return false;
});
В fancybox можно напрямую передавать html код, который он и отобразит внутри себя.
Шикарный плагин.
 

be4ok

Новичок
Иван, у меня свой блог на Wordpress, и там появилась надобность сделать форму в fancybox.

~WR~, спасибо большое за ответ. Буду Вам очень признателен, если покажете как вставить этот код именно в мою форму, т.к. не очень понимаю, как его встроить правильно.


PHP: 
<form id="m" name="myform" action="send.php" method="POST">
<input type="radio" name="param" value="mdm"/>Параметр 1</p>
<input type="radio" name="param" value="bg" />Параметр 2</p>
<input type="text" id="num" name="num" value="text" />Текст</p>
<input name="submit" type="submit">
 
Redjik

Redjik

Джедай-мастер
~WR~
а где preventDefault()?

be4ok
почему тогда не нанять кого-нибудь?
PHP: 
   $('form.fancybox').live('submit',function(e){
	   e.preventDefault();
	   var link = this;
	   $.fancybox.showActivity();
	   $.ajax({
			type		: "POST",
			cache	: false,
			url		: link.action,
			data		: $(this).serializeArray(),
			success: function(data) {

				$.fancybox(data);
								
			}
	  });	
  });
у формы должен быть class = "fancybox"
 

be4ok

Новичок
Иван
Спасибо за ответ. Как попробую - отпишусь.

почему тогда не нанять кого-нибудь?
Нажмите для раскрытия...
Пока это единственная задача, которую мне не удалось решить. Поэтому нанимать только ради одного скрипта, думаю, не стоит.
Если будет что-то более серьезное, то можно подумать об этом.
 

be4ok

Новичок
Иван
Встроил код, при нажатии кнопки submit совершенно ничего не происходит.
~WR~
При Вашем способе при нажатии кнопки страница загружается как и раньше - без фрейма.

В чём может быть причина?
 

be4ok

Новичок
Пока форма делается на локалке.
Fancybox подключен следующим образом:
PHP: 
/fancybox/jquery.fancybox-1.2.6.pack.js
/wp-content/plugins/fancy-box/jquery.fancybox.js?ver=1.2.6
И еще скрипт в хедере:
PHP: 
<script type="text/javascript">

$(document).ready(function() {

$("a.zoom").fancybox();

$("a.zoom1").fancybox({

'overlayOpacity'	:	0.7,

'overlayColor'	 :	'#FFF'

});

$("a.zoom2").fancybox({

'zoomSpeedIn'	 :	500,

'zoomSpeedOut'	 :	500

});

});

</script>
И еще один:
PHP: 
<script type="text/javascript">
	jQuery(document).ready(function($){
		var select = $('a[href$=".bmp"],a[href$=".gif"],a[href$=".jpg"],a[href$=".jpeg"],a[href$=".png"],a[href$=".BMP"],a[href$=".GIF"],a[href$=".JPG"],a[href$=".JPEG"],a[href$=".PNG"]');
		select.attr('rel', 'fancybox');
		select.fancybox();
	});
</script>
 
Войдите или зарегистрируйтесь для ответа.
Сверху