ASP.NET 3.5 and above only

HTML Editor - Knowledge Base

« Back to Knowledge Base list

Cache issue with insert image feature

Q:

Seems the "Insert image feature" has cache issue. Steps to reproduce as below:

a. Go to editor and click on image button.
b. Upload an image from your local. Example- xyz.jpeg
c. insert this image into editor and save content.
d. You can again click on image button and upload another image with same name (xyz.jpeg). Its uploaded successfully (means overrite existing one.). If you preview, you see new image.
e. now select new image and insert into editor.
f. You see the old image gets added into editor although old image is no more in folder too.
g. Also if you see existing saved text of old image, still shows old image. It should be shown with new image.

Problem is in step 'f' and 'g'. Please check and reproduce it with above steps.
Also you can reproduce same thing at your online example - http://www.obout.com/Obout.Ajax.UI/HTMLEditor/examples/default.aspx

Please check and help me in this.

A:

It is not an issue of the Editor, it is a standard cache behavior of all browsers.
If you edit the Image’s URL in the popup: ‘xyz.jpeg?1’, then you will see the new image.
Also you can clean up the browser’s cache.
 
But you can resolve this problem another way – to add random parameter to the Image’s URL.
You can do it with adding the following code to your page:

<script type="text/JavaScript">
  // on page load
  function pageLoad(sender, args) {
     // override some inner client-side methods of the ImageBrowser components
     //-----------------------------------------------------------------------
 
     // returns a value to be inserted to the SRC attribute of the IMG element
     // by default the 'url' parameter is returned
     window.___OAUIHP___.ImageBrowser.prototype.convertToSrc = function (url) {
         // remove all parameters in the URL and add a random parameter
         return encodeURI(url).replace(/(\?[^$]*)$/, "") + (new String("?rnd=" + Math.random()).replace(".", ""));
     };
 
     // returns the original value from the SRC attribute (url) of the IMG element
     // by default the 'url' parameter is returned
     window.___OAUIHP___.ImageBrowser.prototype.convertFromSrc = function (url) {
         // remove all parameters in the URL
         return encodeURI(url).replace(/(\?[^$]*)$/,"");
     };
  }
</script>

One issue is here – the image’s SRC attribute will always contain extra random information.

"I must say the controls are awesome. I am very impressed with Scheduler component."

Kris
Metis Systems

Random testimonial   All testimonials