I have a form split apart throughout 4 tabs. One of the tabs contains photos if the user has uploaded some. Under each photo is a button to delete the photo. It performs an AJAX call to delete the photo and load in a new input[file] field that the user can use to upload another photo.
This works fine. The problem is after the user uploads the new photo, it appears as if the old photo is still there. If the user refreshes the browser, it doesn't go away. The user literally has to hold shift and then refresh (bypass cache).
The problem most likely stems from the fact that the new image gets named the same as the old one... and the browser is simply pulling from it's cache.
What do I need to do to prevent that from occurring? I've already set {cache : false} on the jQueryUI tabs. I believe it has to do with the image being cached by the browser. Is there a way to tell the browser to not cache a few images?