Submit Form in Fancybox and return the result in Parent Page

Question

I am using FancyBox implementation (FancyBox) in my project to prompt user to upload the needed files and upon submitting the form in fancybox, it's properly getting submitted. Now after submitting the form the fancybox will get closed and the parent window will be get updated.

My issue is, the form gets submitted inside the fancybox itself and fancybox content get updated instead of parent window. I use iframe to open FancyBox.

Please see the code

The fancybox page name is fancyfiles.jsp

Inside this JSP i have a function like this to submit the form :

function submitForm()
{ 
 parent.$.fancybox.close();
 target = "_parent";
 document.getElementById("invoice_form").submit();
}

The Parent JSP name is submitfiles.jsp

$(document).ready(function() 
{
 $("#others").fancybox({
  'width'  : '40%',
  'height' : '60%' ,
  'type'   : 'iframe'
 });

 $("#clickme").click(function(){
  json_obj+=']';
     document.getElementById('json_obj').value = json_obj;
     $("#others").trigger('click');
    });


});

Please help me to resolve this. The form inside the fancybox will get submitted, fancybox will get closed and the update will happen only on parent page. Now i am able to submit the form and close the fancybox, but cant able to get the parent windoe get updated. Even tried the page reload but still of no use.

NOTE : I have done enough research on this, tried every possible solution. So please help me get this work. Thanks in advance

lilsizzo lilsizzo · Accepted Answer · 2011-02-10T03:23:59

so do you mean upon closing the fancybox, your parent form should be updated? Try using

onClosed    :   function() {}

its a feature for fancybox whenever you close your fancybox, you would be able to run a ajax script.

Submit Form in Fancybox and return the result in Parent Page

1 Answers