-
FEATURED COMPONENTS
First time here? Check out the FAQ!
Is there any way to specify a default src for the image in case of the giving source patth doesn't exist?
inspired by this stackoverflow answer the immediate translation into ZK would be (using the client/attribute namespace):
<zk xmlns:ca="client/attribute">
<image src="broken-image-url.jpg"
ca:onerror="if(this.src != 'error.png') this.src='error.png'"/>
</zk>
If you wanted to apply this globally, the following widget override will add this listener to each image-widget automatically.
<zk>
<script><![CDATA[
zk.afterLoad('zul.wgt', function() {
var xImage = {};
zk.override(zul.wgt.Image.prototype, xImage, {
bind_ : function() {
var result = xImage.bind_.apply(this, arguments);
this.$n().addEventListener('error', function(event) {
if(this.src != 'error.png') this.src='error.png';
});
return result;
}
});//zk.override
});//zk.afterLoad
]]></script>
<image src="broken-image-url.jpg"/>
</zk>
I also checked the CSS only solution mentioned there, however it only worked in Chrome on my side.
Robert
Asked: 2017-07-12 13:54:20 +0800
Seen: 18 times
Last updated: Aug 11 '17
How to control selectAll() feature in a Listbox with multiple=true and checkmark=true
ZK8 Wizard Series: Part 2 now released!
Faster And Lighter, The Performance Test On ZK8
org.zkoss.xel.XelException: Resource not found: http://www.zkoss.org/dsp/web/core
How To Check Dirty Status in ZK8?
Come and join the ''JS'' Hunt!