PDA

View Full Version : 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:

.x-item-disabled-ie {
color:gray;cursor:default;opacity:.6;-moz-opacity:.6; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
}
Then use
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?


{
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

<!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):

<!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 :)
lethalpunch
24 Mar 2013, 9:36 PM
I hav tried everything mentioned above but none of them works for me.
please provide some alternate soln.
I m using Extjs 3.4 in IE 8.
thanks in advance.
CVA
31 Dec 2014, 2:17 AM
2jagadeesha Thx