Submit Form And Close Fancybox, Javascript

Question

I'm using Fancybox to trigger a search form pop-up and the form uses Javascript validation to check and submit. The problem that I have is that I can't get the Fancybox screen to close and then run the function. Here is the code that I'm using at the moment:

<form id="searchForm" method="post" action="<?php echo $search; ?>.php?type=rad" onsubmit="javascript:parent.jQuery.fancybox.close();">

$('#enterButton').click(function()
        {
        if(searchok == 1)
        {           
            $('.searchValidation').addClass("sending");
            $("#searchForm").submit();
        }
        else
        {
        $('.searchValidation').addClass("validationError");
        }
        return false;
        });

How can I get the fancybox window to close on submit() but still effectively run the form function in the parent window?

Answer 1

Assuming that the #enterButton is the submit button, you are better off calling the

parent.jQuery.fancybox.close();

inside the validation function. I'd suggest something like this:

$('#enterButton').click(function()
        {
        if(searchok == 1)
        {           
            $('.searchValidation').addClass("sending");
            $("#searchForm").submit();
            parent.jQuery.fancybox.close();
        }
        else
        {
        $('.searchValidation').addClass("validationError");
        }
        return false;
        });

However parent.jQuery.fancybox.close(); needs to be used only if you are using it within an iframe . You can replace it with jQuery.fancybox.close();

Here's a reference you can check: parent.jQuery.fancybox.close(); from within Fancybox only closes Fancybox once