Load alternate image if there is an error in the configured image URL – IMG Tag

Requirement:

We have a SharePoint BCS Profile page (with XSLT customization). In this page we have to load an image in one of the column/cell. There is no problem in loading the image with the IMG tag until the image is not available. If the image is not available in the given URL, it will normally show the cross mark (X) symbol.

The customer requirement is below:

If the image is not available in the given URL location then show an alternative image / text (Preview not Available).

Solution:  

By adding the below tag you can overcome this issue

<img src=”<Image URL>” alt=”” onError=”this.src=<Alternate Image URL>’/>

We have to be very cautious when we use this code. The browser will be stuck in an endless loop if the onError alternate image itself gives an error in loading. So to avoid this use the below code

<img src=”<Image URL>” alt=”” onError=”this.onerror=null;this.src=<Alternate Image URL>’/>

Advertisements

About Joseph Velliah
As a SharePoint Developer my professional interests tend to be technical and SharePoint focused. I run a blog at "SP RIDER" where you can expect to read HOW TOs and scenarios that I run into during my day to day job. I hope my posts will give back a little to the community that is helped me.

Comments are closed.

%d bloggers like this: