Combobox disappears on disable in IE 7

**deepakramana.r** · 3 Nov 2009, 2:04 AM

I want to disable a combobox.

Ext.getCmp(elmID).disable();

When I do this the combobox disappears in IE 7. Please help

**KenHuffman** · 18 Nov 2009, 2:21 PM

I've got the same problem. Calling setDisabled(true) on an Ext.form.ComboBox, makes it disappear on IE8. Commenting out the call, and the component does not disappear. Works fine for Firefox.

[I even put the call to setDisabled(true) in a few second DelayTask() by itself to verify it was the culprit. It disappeared when the task fired.]

Anyone have a fix?

**deepakramana.r** · 18 Nov 2009, 9:19 PM

Hi,

Ext.getCmp(elmID).disabled = true;
Ext.getCmp(elmID).setEditable(false);

This worked

**KenHuffman** · 19 Nov 2009, 10:19 AM

Setting it to non-editable does not make it appear disabled. Here is a workaround that does.

Clone the x-item-disabled CSS:

Code:

.x-item-disabled-ie {
    color:gray;cursor:default;opacity:.6;-moz-opacity:.6; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
}

Then use

Code:

disabledClass: Ext.isIE ? 'x-item-disabled-ie' : 'x-item-disabled'

in the ComboBox's config.

**Gozer** · 8 Dec 2009, 7:28 PM

I tried both of the solutions suggested, but neither seemed to have any effect at all. Has anyone found a better fix?

Code:

{
	fieldLabel: 'Status',
	hiddenName: 'status_id',
	xtype: 'combo',
	store: status_store,
	valueField: 'id',
	displayField: 'name',
	typeAhead: true,
	mode: 'local',
	triggerAction: 'all',
	allowBlank: true,
	selectOnFocus: true,
	forceSelection: true,
	value: 0
	,disabled: true
},{
	xtype: 'panel',
	border: false,
	html: '<br />'
},{
	fieldLabel: 'Status #1 Date',
	name: 'status_1_date',
	xtype: 'datefield',
	width: 100
	,disabled: true
},{
	fieldLabel: 'Status #1',
	name: 'status_1',
	allowBlank: true,
	xtype: 'textarea',
	height: 60
	,disabled: true
},{
	xtype: 'panel',
	border: false,
	html: '<br />'
},{
	fieldLabel: 'Status #2 Date',
	name: 'status_2_date',
	xtype: 'datefield',
	width: 100
	,disabled: true
},{
	fieldLabel: 'Status #2',
	name: 'status_2',
	allowBlank: true,
	xtype: 'textarea',
	height: 60
	,disabled: true
},{
	xtype: 'panel',
	border: false,
	html: '<br />'
},{
	fieldLabel: 'Status #3 Date',
	name: 'status_3_date',
	xtype: 'datefield',
	width: 100
	,disabled: true
},{
	fieldLabel: 'Status #3',
	name: 'status_3',
	allowBlank: true,
	xtype: 'textarea',
	height: 60
	,disabled: true
}

Thanks,
Gary

**johnrembo** · 22 Jan 2010, 1:09 AM

additional notice

this happens on IE7/8 with

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

(none of fixes above works)

while with i.e. following doctype declaration everything's working fine (no fix necessary):

HTML Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN" "http://www.w3.org/TR/html4/strict.dtd">

any solution?

**jminnick** · 28 Apr 2010, 7:18 AM

this.setDisabled(true);
this.setEditable(false);

worked for me (IE7)

**Yazla** · 22 Jun 2010, 3:44 AM

Hi.
I have the same trouble, and i am wondering is there some "official" fix? or just workaround?

Thanks.

Cheers.

**sencha10** · 14 Jan 2011, 11:24 AM

Hey Ext developers, anyone?

Found out that having a different hiddenName and id solves my problem.
In your example the id was not set. Try to make sure both are unique among all elements.
i.e. try
...
hiddenName:'status_name',
id:'status_id'

**jagadeesha** · 23 Nov 2012, 7:37 AM

.x-item-disabled {
filter:'' !important;
}

This worked for me

Thread: Combobox disappears on disable in IE 7

Thread Tools

Search Thread

Display

Combobox disappears on disable in IE 7

I get the same problem on IE8

Better solution

Same issue, but no luck with suggested solutions

This is still a bug in 3.3.1!

Posting Permissions

Stay Connected

Stay Connected

Sign up for Sencha News