how to close colorbox within iframe?

Question

i have a page manageGroup.php, where user can also add member to group. I used colorbox to show the addGroupMember.php. Now i need to close that colorbox once i have done submitting the form.

javascript i am using in manageGroup.php

<script language="javascript" type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript" src="js/dropdown.js"></script>
<script type="text/javascript" src="js/jquery.colorbox.js"></script>
<script type="text/javascript">
 $(document).ready(function(){
 $(".iframe").colorbox({width:"80%", height:"80%", iframe:true});
 });
</script>

The link i am using to open colorbox

<a class="iframe" href="addGMember.php?id=<?php echo base64_encode($fetch->g_id)?>">Add Member</a>

the code in addGroupMember.php is like this:-

if($_POST['add']=="Go")
{
  $gid = $_POST['id'];
  $ii=0;
  $insert = "INSERT INTO ".DBGMEMBER." (gm_g_id,gm_m_id) VALUES ";
  foreach($_POST['gMember'] as $gMember)
  {
    if($ii==0)
    {
        $insert .= " ('".$gid."' , '".$gMember."')";
    }
    else
    {
        $insert .= " ,('".$gid."' , '".$gMember."')";   
    }
    $ii++;
  }
  $db->execute($insert);// after this i want to close the colorbox
  echo "<script>parent.$.fn.colorbox.close(); </script>";// code i used, but not working
}

Answer 1

First: Elaborate you question. The information you provided is some what shorthanded. There's no chance one could grip what you are doing. Also include some more sample code.

Only thing I could guess is that you trying to trigger the method in how it's written. Everything you add to the $.fn object is bound to all jQuery objects.

// doesn't work
$.fn.colorbox.close()
// proper way
$('idOfDomElement').colorbox.close()

..fredrik

Answer 2

I just tried to close colorbox from within the iframe but couldn`t get it to work. I used $('#closebox').colorbox.close() and without any luck.

Answer 3

I think the problem is that the colorbox belongs to the parent, not to the DOM in the iframe.

My guess is you'll need to call parent.[way to get the element or $.fn object].colorbox.close() or you'll need to add a function to the parent document and call parent.myCloseFunction()

Answer 4

i got it done for me, a bit crazy way, anyways u can too give it a try.

Supposing your page in iframe as x.php having form named xyz

<?php
  if($_post['submit']=='Submit')
  {
    //some php code here
    if(success)
     echo "<script>parent.$.fn.colorbox.close(); </script>";
    else
    {
      //some error handling here;
    }
  }
?>
<form name='xyz' action='x.php'>
 //some html code here
 <input type='Submit' name='submit' />
</form>

Answer 5

Make sure that the page loaded within the iFrame includes all of the necessary references to the colorbox js, jQuery js and probably even the colorbox CSS just to be safe.

Then the parent close call should work: parent.$('.yourElement').colorbox.close();

Answer 6

This one worked out perfectly for me and should work for you

parent.$.fn.colorbox.close()

Answer 7

thanks Ashish Rajan, this solution worked for me as well. :)