验证表单后调用函数以关闭父项(包括iframe)

时间:2012-10-16 05:55:43

标签: validation iframe fancybox

编辑:我最近了解到这个问题实际上是两个不同的问题:1)使用脚本在必要的接合点关闭父元素,以及2)确保所有必需的函数都被调用以正确的顺序完成。我找到了两种方法来关闭我在下面包含的父元素。第二个问题在此处讨论:Calling jQuery function in php (or modifying javascript so php runs the remaining code)


原始问题

我有两个函数,我需要在表单验证和提交后调用,但是我没有成功将这些函数插入到我的脚本中而不会阻止其他函数完成(在javascript或php中)。

如何将这些功能集成到脚本中关闭父项(iframe和通知给新用户)和/或在验证并提交表单后从php调用它们?

新功能:

parent.close_field('notice');
parent.$.fancybox.close();

现有Javascript

var $custInfo = $("#customer_info");
  $(document).ready(function () {
    var validator = $custInfo.validate({
        rules: {..  },
        messages: {..},
        errorLabelContainer: "#messageBox",
        submitHandler: function () {  
            $custInfo.ajaxSubmit({               
            });
        }
    });                 
    $custInfo.find("input[name=gender]").change(function () {
        if ($(this).val() == "male") {
            $custInfo.submit();
        }
    });
});

我正在使用Fancybox2。我还尝试了其他方法,这些方法需要向表单标记添加属性,但是那些完全绕过脚本。

2 个答案:

答案 0 :(得分:0)

我最近了解到这个问题实际上是两个不同的问题:1)使用脚本在必要的接合点关闭父元素,以及2)确保必要的函数都以正确的顺序被调用和完成。

我想出了两种关闭父元素的方法,我将在下面包含这些元素。第二个问题在这里解决: Calling jQuery function in php (or modifying javascript so php runs the remaining code)

我用于关闭父元素的方法

我想出了两种关闭父元素的方法。在表单提交时我使用方法1关闭它,在我需要关闭项目的情况下使用方法2(即如果用户导航到特定页面)

方法1

在我的特定示例中,我需要为所有人关闭“通知”,但只关闭为男性的新用户关闭iframe,所以我将此添加到函数中:

submitHandler: function () {
            $custInfo.ajaxSubmit({
            success: function () {
if ($('input[name=gender][value=female]').is(':checked')){                                                      
        parent.close_field('notice');
        window.location.href="page2.html";                                   
        }                             
        else if ($('input[name=gender][value=male]').is(':checked')) {
        parent.close_field('notice');
        parent.$.fancybox.close();
        alert("This service is not yet available for men, but we'll be sure to send an invitation as soon as it is");                             
        }
       }
     });

方法2

JS

function close_parent_items() {
     parent.close_field('notice');
     parent.$.fancybox.close();
}

HTML

onclick="close_parent_items();"

答案 1 :(得分:0)

简单的解决方案: 在表单标记中添加此内容

target="_parent"

喜欢

<form method="post" action="your_action_file" target = "_parent" >
</form>

它对我有用。