disabled

Ext JS 4 – Enable/Disable based on Grid Selections

	buildSelectionModel : function () {
		return Ext.create('Ext.selection.CheckboxModel', {
			listeners: {
				scope: this,
				selectionchange: function(sm) {
					if (sm.getCount()) {
						this.approveBtn.enable();
						this.denyBtn.enable();
					} else {
						this.approveBtn.disable();
						this.denyBtn.disable();
					}
				}
			}
		});
	}
Advertisements

Ext JS Disabling Form Field Labels

Making a form field label look disabled when the form field is disabled by adding an override to Ext JS.

Ext.override(Ext.form.Field, {
    onDisable : function(){
        Ext.form.Field.superclass.onDisable.call(this);
        if(this.getItemCt) {
            var label = this.getItemCt().child('label');
            if (label) label.addClass(['find-label-disabled', 'x-item-disabled']);
        }
    },
    onEnable : function(){
        Ext.form.Field.superclass.onEnable.call(this);
        if(this.getItemCt) {
            var label = this.getItemCt().child('label');
            if(label) label.removeClass(['find-label-disabled', 'x-item-disabled']);
        }
    }
});

In this specific case, I had to add

	.find-label-disabled {
		background-color: white;
	}

since the background was white and I didn’t want funny green text.

Unfortunately, I no longer have the link to the posting in the Ext JS forums.

Ext JS – Disabled Form Fields in Firefox Look Green

If you have a field on a FormPanel that is a nice greenish color in Firefox instead of gray when disabled, then you need to set the background color on the container. At least that is what worked for me. This was specifically occurring on a checkbox. I had to add

.x-form-check-wrap {
    background-color: white;
}

to my styles to fix it.

My situation was a FormPanel where frame was set to false and therefore my form had a white background. Here is a picture of the offending checkbox:

Helpful Links:
Disabled Elements in Firefox 3-4
Firefox Opacity, Text Gets Weird