Search code examples
javascriptcolorbox

How to close colorbox window after submit, and refresh image on parent page?


I am using colorbox for a modal display, which opens for the user when clicking on an image to update it. Once the user uploads a new image and hits submit on the colorbox modal, the modal should close and refresh the image on the parent page.

I am using the following onClick event within the submit button:

  <input onClick='window.parent.location.reload(true);' type='submit' value='Submit' name='save_button' id='save_button'>

This closes the modal and refreshes the parent page.php. But for some reason, it does not refresh the old image to show the new image the user just uploaded.

EDIT: Added Colorbox Code

The script that calls the color box was conflicting with other javascript code, so I added the following script above the colorbox code, and changed the $ to jQuery in the code:

<script>jQuery.noConflict();
  jQuery(document).ready(function(){
  jQuery("iframe").hide();
  });

  $('input').hide();
</script>

<script>
  jQuery(document).ready(function(){
  jQuery(".iframe").colorbox({iframe:true, width:"748px", height:"92%"});
  });
</script>

Any ideas?


Solution

  • Here is the code, specific to colorbox script, which ended up working for me. I added onClosed:function(){ location.reload(true); } in the last part of the script below:

    <script>jQuery.noConflict();
      jQuery(document).ready(function(){
      jQuery("iframe").hide();
      });
    
      $('input').hide();
    </script>
    
    <script>
      jQuery(document).ready(function(){
      jQuery(".iframe").colorbox({iframe:true, width:"748px", height:"92%", onClosed:function(){ location.reload(true); } });
      });
    </script>
    

    Then I added the onClick event inside the submit button code:

    <input type='submit' value="Submit' onClick='parent.jQuery.fn.colorbox.close();'>
    

    This closes the colorbox modal while refreshing the parent page, along with the image for all current versions of FF, IE, Opera, and Chrome. It refreshes page, but not the image in Opera.