Ext.BasicDialog , button with icon issue - Ext JS

# 2 02-25-2007, 08:00 AM

You are missing the class. 'x-btn-text-icon'. To explain further:

Each button can have one of 3 modes:

Text-only (default), Icon-only and Text + Icon

The way of triggering a specific mode is with a CSS class:

cls: 'x-btn-icon' // icon only

cls: 'x-btn-text-icon' // icon and text

You can either set your icon inline (as you have done) or you can set 2 classes and set it in CSS:

cls: 'x-btn-icon foobar'

and add this CSS:

.foobar .x-btn-text {
background-image:url(foo.gif);
}

# 3 02-25-2007, 08:08 AM

thanks for your reply,

but if tested:
dialog.addButton({icon:'test.gif' , cls: 'x-btn-text-icon' , text : 'test'} , dialog.hide);

the problem is always present;-(

# 4 02-25-2007, 08:37 AM

Ah I didn't even notice in your first post that you are calling dialog.addButton. Look at the docs for the first param:

* @param {String/Object} config A string becomes the button text, an object is expected to be a valid Ext.DomHelper element config

It's not a Button config but a DomHelper config to make custom buttons (e.g. image buttons).

I just added to the code to sniff the object and determine if it is a Button config or DomHelper config so in the next rev you will be able to pass in a Button config as well.

# 5 02-25-2007, 04:30 PM

thanks jack ;-)