CODEWITHSUNDEEP
javascriptjquerycaching
abhi
abhi

Reputation: 15

Loading image with same name via jquery

i need to replace the uploaded image with the previous image with same name and size and after sucessfull upload refresh the div to show the new image .everything is working fine except that the new image is not updated on ajax load method i have to refresh the whole page to do so.

hare is related code

var options = {
        target:   '#imager778',   // target element(s) to be updated with server response 
        beforeSubmit:  beforeSubmit,  // pre-submit callback 
        success:       afterSuccess,  // post-submit callback 
        resetForm: true        // reset the form after successful submit 
    };  
     $('#MyUploadForm').submit(function() { 
        $(this).ajaxSubmit(options);            
        // always return false to prevent standard browser submit and page navigation 
        return false; 
    });
    function afterSuccess()
   {
    $('#submit-btn').show(); //hide submit button
    $('#loading-img').hide(); //hide submit button
    $("#divofimage").load("page.php #divofimage");
    }

can any one suggest me anything i think ths is because of caching i have already tried ading random numbers to the url but no effect

Upvotes: 1

Views: 479

Answers (1)

captain_a
captain_a

Reputation: 3287

We can break the cache of browser by forcing the image through ajax and then associating the new image with the timestamp .

var name='FULL_PATH?dt=' + (+new Date());
$('<img src="'+name+'">').load(function() {
       $('#ID').html('');
       $(this).width('40').height('40').appendTo('#ID');
});

and you have got the nice and cool new image :)

Upvotes: 1

Related Questions