sdev
sdev

Reputation: 13

Sencha Ext JS 5.1.0 catch image setSrc error event

I load an image in extjs 5.1.0 with setSrc("myUrl"). In case the Url of the image doesn't exist how can I catch the "unable to find url" event? (I take in the web browser: "Failed to load resource: the server responded with a status of 404 -Not Found" )

I want this because i have to stop the loading splash icon when the image failed to load

Upvotes: 0

Views: 880

Answers (1)

Simon Hoss
Simon Hoss

Reputation: 562

The native class Ext.Img doesn't have a error event.

Create your own class and extend from Ext.Img. Then set the dom onerror handler on the imgEl with this you can handle the load error event. In the callback you can fire your own event or set an standard image or whatever you want.

Example: https://fiddle.sencha.com/#fiddle/lm1

Ext.define("MyImage", {
    extend : "Ext.Img",

    onRender : function() {
        var me = this;
        me.callParent(arguments);
        me.imgEl.dom.onerror = me.onImageLoadError;
    },

    onImageLoadError : function() {
        alert("Error loading image")
    },

    onDestroy : function() {
        var me = this;
        me.imgEl.dom.onerror = null;
        me.callParent(arguments);        
    }
});

Upvotes: 2

Related Questions