zuriosam
zuriosam

Reputation: 115

How to refresh image in Extjs?

I have the image whose src property is bound to viewModel:

xtype: 'image',
height: 35,
width: 35,
bind: {
    src: '{photo_path}',                        
}

where photo_path is fixed link to the profile photo of the user, let's say 123.jpg. How to refresh the image when user changes profile photo (link remains the same)?

I've tried to change data in viewModel to some temporary link and then to restore to original link, in order to 'refresh' the image, but it doesn't work.

I noticed that image is cashed, because after changing the photo, when I display the image link in a browser, it shows the old photo until the browser is refreshed.

Upvotes: 0

Views: 328

Answers (2)

Arthur Rubens
Arthur Rubens

Reputation: 4706

You can try to add some dummy GET param to avoid browser caching. Something like this:

url = 'YOUR_IMAGE_URL' + '?_dc=' + (new Date())*1;

Upvotes: 1

Tom Vaughan
Tom Vaughan

Reputation: 473

C/P from docs, you don't say which toolkit so this if for classic.

var changingImage = Ext.create('Ext.Img', {
    src: 'http://www.sencha.com/img/20110215-feat-html5.png',
    width: 184,
    height: 90,
    renderTo: Ext.getBody()
});

// change the src of the image programmatically
changingImage.setSrc('http://www.sencha.com/img/20110215-feat-perf.png');

So, use setSrc method to change the image.

Upvotes: 0

Related Questions