View Full Version : how can i put picture for information between text and textfield

13 Aug 2011, 3:05 PM

Is any one knows ,How can I put any picture between text and textfiled.

like this question mark picture icon ,for getting information about text field


13 Aug 2011, 3:44 PM
Here are a couple of ways to do it, I'm sure there are more.

new Ext.form.field.Text({
fieldLabel: 'Hello<img src="pic.png" />',
labelSeparator: ''

var textField = new Ext.form.field.Text();

new Ext.container.Container({
items: [
forId: textField.getInputId(),
text: 'Hello',
xtype: 'label'
}, {
src: 'pic.png',
xtype: 'image'
layout: {
align: 'middle',
type: 'hbox'

It's then just a case of tidying up the widths, paddings, margins, etc. to get it all looking the way you want.

The first option may appear simpler but personally I think I prefer the second option.

13 Aug 2011, 4:22 PM
I like that second option, too. The image component lets you easily set event handlers, set the src, etc. You might wrap them in a fieldcontainer instead of just a container since fieldcontainer is labelable.

13 Aug 2011, 6:19 PM
That's just overnesting...

Just need to insert the image tag into the label. You may want to check out Ext.form.Labelable and the labelableRenderTpl property

14 Aug 2011, 3:03 PM
Thanks Guys