使用Fancybox Ajax功能在iFrame中提交表单

Question

我想使用Fancybox在iFrame内显示注册表格。用户填写完详细信息后，应使用Jquery/Fancybox中的ajax机制处理详细信息，并在同一Fancybox iframe中显示值。

如何实现这一点？我已经苦思冥想了一整天，不知道哪里出了问题。

以下是我的代码：

$("a.interested").fancybox({
                'width': 400,
                'height': 400,
                'enableEscapeButton' : false,
                'overlayShow' : true,
                'overlayOpacity' : 0,
                'hideOnOverlayClick' : false,
                'type': 'iframe',
                 ajax: {
                           type     : "POST",
                           cache    : false,
                           url      : "/components/profile/buyer/regbuyer1.php",
                           success: function(data) {
                                $.fancybox(data);
                            }
                        }
            });

一些代码示例会非常有帮助。

谢谢。

- Stanley Ngumo

Answer 1

$("a.interested").click(function(){

    $.ajax: {
        type     : "POST",
        cache    : false,
        url      : "/components/profile/buyer/regbuyer1.php",
        success: function(data) {
            $.fancybox({
                'width': 400,
                'height': 400,
                'enableEscapeButton' : false,
                'overlayShow' : true,
                'overlayOpacity' : 0,
                'hideOnOverlayClick' : false,
                'content' : data
            });
        }
    }
});

from http://fancybox.net/blog

- Sue-Jhen Dong

Answer 2

这个想法是在fancybox中打开一个iframe，然后在该iframe中使用常规post方式发送请求，因为iframe内的所有请求都将保留在该iframe中。

所以你只需要在你的代码中做这样的处理：

$("a.interested").fancybox({
                'width': 400,
                'height': 400,
                'enableEscapeButton' : false,
                'overlayShow' : true,
                'overlayOpacity' : 0,
                'hideOnOverlayClick' : false,
                'type': 'iframe',
                'href': "/components/profile/buyer/regbuyer1.php" //or any other url that contains the contents of that iframe
            });

- Ramuns Usovs

Answer 3

我相信fancybox中的ajax选项仅用于加载数据，而不是发送数据。您需要自己连接ajax post到表单。在fancybox网站上有一个很好的例子（http://fancybox.net/blog）示例＃5。我认为这正是您想要的。

- David Radcliffe