How to reload an image or not cache an image

[Fábio Matte]

I have a UnimDBListGrid, in which I load some information using HTML via UniEvents, according to this code below:

Whatch line:

'<td style="width: 5.69044%; height: 43px;"><img src="ArquivosCliente/{7}/{6}/Fotos/Bens/thumbmail/{1}.jpg" alt="{3}" onerror="img/semimagem.jpg" width="50" height="50" /></td>' +

Full Code:

function beforeInit(sender, config)
{
  config.loadingText='Carregando...';
  config.grouped=true;
  config.selectedCls='';
  config.disableCaching = true;
  config.itemTpl= 
                  ' <table style="border-collapse: collapse; width: 49.7724%; height: 43px;" border="0"; white-space: word-wrap:break-word>' +
                  ' <tbody>' +
                  ' <tr style="height: 63px;">' +
                  '<td style="width: 5.69044%; height: 43px;"><img src="ArquivosCliente/{7}/{6}/Fotos/Bens/thumbmail/{1}.jpg" alt="{3}" onerror="img/semimagem.jpg" width="50" height="50" /></td>' +
                  ' <td style="width: 94.3096%; height: 43px;">' +
                  '<table style="width:100%;white-space: nowrap;vertical-align:middle;">'+
                  ' <tbody>' +
                  ' <tr>' +
                  '<td><span style="font-size:9px;padding-left:1px;"><span style="font-family:tahoma,geneva,sans-serif"><span style="color:#0000CD"><strong>CODIGO: {0}</strong></span></span></span></td>' +
                  ' </tr>' +
                  ' <tr>' +
                  '<td><span style="color:#B22222"><span style="font-size:12px;padding-top:1px;padding-left:1px;"><span style="font-family:tahoma,geneva,sans-serif"><strong>{3}</strong></span></span></span></td>' +
                  ' </tr>' +
                  ' <tr>' +
                  '<td><span style="color:#006400"><span style="font-size:12px;padding-top:1px;padding-left:1px;"><span style="font-family:tahoma,geneva,sans-serif"><strong>CHAPA ATUAL: {1}  |  CHAPA ANT.: {2}</strong></span></span></span></td>' + 
                  ' </tr>' +
                  ' </tbody>' +
                  ' </table>' +
                  ' </td>' +
                  ' </tr>' +
                  ' </tbody></table>';       

}

However, if I change the image on the server, the list is not shown with the new image, it is just loading the old one, even if I delete this image on the server, it continues to be displayed.

So, how can I reload the image or not cache it !!!

 

Result:

Edited February 8, 2021 by Fábio Matte

[Hayri ASLAN]

Hi

Add a random number after your link. Like

url:= 'test.jpg?'+IntToStr(Random(99999999));

[Fábio Matte]

35 minutes ago, Hayri ASLAN said:

Hi

Add a random number after your link. Like

url:= 'test.jpg?'+IntToStr(Random(99999999));

I put it that way, but it still didn't work.

[Sherzod]

13 hours ago, Fábio Matte said:

This is not correct...

[Fábio Matte]

2 hours ago, Sherzod said:

This is not correct...

And how could I do this correctly?

[Hayri ASLAN]

Just now, Fábio Matte said:

And how could I do this correctly?

You added it into javascript code but my example was for delphi.

I just gave idea to you. If you are using javascript, please check how to create random number.

[Sherzod]

1 hour ago, Fábio Matte said:

And how could I do this correctly?

You have to use XTemplate with a function.

[Fábio Matte]

4 hours ago, Sherzod said:

You have to use XTemplate with a function.

I found this function here that I believe is a desire to give a Reload / Fresh of the image:

{
  xtype: 'box',
  imageSrc : 'getImage.do',
  autoEl: {tag: 'img', height: 60, width: 205},
  refreshMe : function(src){
     var el;
     if(el = this.el){
        el.dom.src = (src || this.imageSrc) + '?dc=' + new Date().getTime();
     }
  }
  listeners : {
     render :  function(){
        this.refreshMe();
     }
  }
}

Or is Code:

var img = Ext.getCmp('img_a');
img.updateSrc('...'); // or img.setSrc('...');

Ext.create('Ext.Img', {
  src: 'http://redino.net/xxx.jpg?' + new Date().getTime()
});

Note: But I have no idea how to use it.

But how can I use the code above implementing it in the code below:

function beforeInit(sender, config)
{
  config.loadingText='Carregando...';
  config.grouped=true;
  config.selectedCls='';

 var descr =
			'<table style="width: 100%; border-collapse: collapse; border-style: none; height: 10px;" border="0"> ' +
			'<tbody> ' +
			'<tr style="height: 10px;"> ' +
			'<td style="width: 9.33229%; height: 10px;"> ' +
			'<table style="height: 100%; width: 100%; border-collapse: collapse; border-style: hidden;" border="0" cellspacing="0" cellpadding="0"> ' +
			'<tbody> ' +
			'<tr> '    +
			'<td style="width: 100%;"><div class="circle"><img style="border-style: none; display: block; margin-left: auto; margin-right: auto;" src="ArquivosCliente/{7}/{6}/Fotos/Bens/thumbmail/{1}.jpg" onerror="this.src="http://wps.singus.com.br/html/img/singuslogo.png" alt="" width="50" height="55" </></div></td> ' +
			'</tr> ' +
			'</tbody> ' +
			'</table> '  +
			'</td> '      +
			'<td style="width: 90.6677%; height: 10px;"> '+
			'<table style="width: 100%; border-collapse: collapse; border-style: hidden;" border="0" cellspacing="0" cellpadding="0"> '+
			'<tbody> '+
			'<tr> ' +
			'<td style="width: 100%;"><span style="font-size: 11px; padding-left: 5px;"><span style="font-family: tahoma,geneva,sans-serif;"><span style="color: #0000ff;"><strong>'+
			'CODIGO: {0}</strong></span></span></span></td> '+
			'</tr> '+
			'<tr> '  +
			'<td style="width: 100%;"><span style="font-size: 11px; padding-left: 5px;"><span style="font-family: tahoma,geneva,sans-serif;"><span style="color: #ff0000;"><strong>{3}</strong></span></span></span></td> '+
			'</tr> '+
			'<tr> ' +
			'<td style="width: 100%;"><span style="font-size: 11px; padding-left: 5px;"><span style="font-family: tahoma,geneva,sans-serif;"><span style="color: #003300;"><strong>CHAPA ATUAL: {1}  |  CHAPA ANT.: {2}</strong></span></span></span></td> '+
			'</tr> '+
			'</tbody> '+
			'</table> ' +
			'</td> '  +
			'</tr> '  +
			'</tbody> '+
			'</table>';    

  config.itemTpl = new Ext.XTemplate(descr);

}