0

default image src

asked 2017-07-12 13:54:20 +0800

sbasly gravatar image sbasly
3 1

Is there any way to specify a default src for the image in case of the giving source patth doesn't exist?

delete flag offensive retag edit

1 Answer

Sort by ยป oldest newest most voted
0

answered 2017-08-11 04:43:31 +0800

cor3000 gravatar image cor3000
6280 2 7

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

link publish delete flag offensive edit
Your answer
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

Follow
2 followers

RSS

Stats

Asked: 2017-07-12 13:54:20 +0800

Seen: 18 times

Last updated: Aug 11 '17

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More