Question

What Im Doing: Trying to call Fancybox from an iFrame to be appended to the parent and not the iFrame, while parsing a url for use with the Fancybox ‘href’ parameter.

Problem: This is being used for a user image upload form, the first upload produces the wanted result; fancybox popup with image. Subsequent attempts cause Fancybox to link to the first image, as if it is caching it. The url never actually changes as each upload overwrites the last image, but the image does change.
Refreshing the page will begin this cycle again. If you right click the link and open in new window/tab you get the new image, and then the fancybox will also be updated for that image.

Code: This is the code being output by the php once a user has sucessfully uploaded an image – in hope of creating a link to that image.

echo "<p>" . '<a id="image-preview" href="/images/uploads/' . preg_replace("/[^A-Za-z0-9_]+/", "", $result[0]['Klarents_Model_Project']['project_name']) . '/' . 
                        preg_replace("/[^A-Za-z0-9_]+/", "", $result[0]['Klarents_Model_Company']['company_company_name']) . '_' .
                        (($this->getRequest()->getParam('filename') !== "") ? 
                            $this->getRequest()->getParam('filename') : $result[0]['Klarents_Model_Company']['company_id']) . 
                        "." . $ext . '" onclick="event.preventDefault();parent.fbuPreview($(this).attr(\'href\'));">Image preview' . "</a></p>";`

And this is found on the parent page.

function fbuPreview(url){
    $.fancybox({
        'href' : url
    }); 
}

Regards,

Answer 1

You have to add a param to the image like:

/images/uploads/something/customer/uploadedfilename.jpg?date=20120305122713

This has a different URL and will not give the result as the previous image. You can not clear the cache by Javascript but adding a param which is the time. Will force the browser the load the new image.

Currently the browser is caching the IMG URL. And if it’s the same he will always get it out of cache untill you refresh the page.

I’ve had this problem a couple of time, the only work around is to add a param.