Load a external image in a Ext.Js Window

Question

I need to know how to load a external image e.g. http://www.google.co.za/intl/en%5Fcom/images/logo%5Fplain.png into a new ExtJs window.

Answer 1

If this is the only content in the EXTjs Window then you can set it using the html option in the window configuration. Something like this

var win = new Ext.Window({
    html: '<img src="http://www.google.co.za/intl/en%5Fcom/images/logo%5Fplain.png" />',
    height: 150,
    widht: 250
});

If there are more contents in the window then you can add the html to the html property of the container for the image

Answer 2

Please take a close look at body property documentation:

body : Ext.Element

The Panel's body Element which may be used to contain HTML content. The content may be specified in the html config, or it may be loaded using the autoLoad config, or through the Panel's Updater. Read-only. If this is used to load visible HTML elements in either way, then the Panel may not be used as a Layout for hosting nested Panels. If this Panel is intended to be used as the host of a Layout (See layout then the body Element must not be loaded or changed - it is under the control of the Panel's Layout.