Ext.define("school.override.form.field.ComboBox", { override: "Ext.form.field.ComboBox", clearable: false, config: { triggers: { clear: { weight: -1, cls: 'fa-times', hidden: true, lazyVisible: true, onFieldFocus: function() { var field = this.field; if(!field.readOnly && field.clearable) { this.setHidden(false); } }, onFieldBlur: function() { var field = this.field; if(!field.readOnly && field.clearable) { this.setHidden(true); } }, handler: function() { if(!this.readOnly && this.clearable) { this.setValue(null) this.triggers.clear.setHidden(true) this.fireEvent('clear', this); } } }, picker: { handler: 'onTriggerClick', scope: 'this', focusOnMousedown: true } } }, setReadOnly: function(readOnly) { var me = this, triggers = me.getTriggers(), hideTriggers = me.getHideTrigger(), oVisible = {}, trigger, id; readOnly = !!readOnly; if (triggers) { for (id in triggers) { oVisible[id] = triggers[id].isVisible(); } } me.callParent([readOnly]); if (me.rendered) { me.setReadOnlyAttr(readOnly || !me.editable); } if (triggers) { for (id in triggers) { trigger = triggers[id]; /** * if trigger's 'lazyVisible' is true,this trigger's 'visible' will not controlled beed 'setReadOnly' */ if(trigger.lazyVisible) { trigger.setVisible(oVisible[id]); continue; } /* * Controlled trigger visibility state is only managed fully when 'hideOnReadOnly' is falsy. * Truth table: * - If the trigger is configured/defaulted as 'hideOnReadOnly : true', it's readOnly-visibility * is determined solely by readOnly state of the Field. * - If 'hideOnReadOnly : false/undefined', the Fields.{link #hideTrigger hideTrigger} is honored. */ if (trigger.hideOnReadOnly === true || (trigger.hideOnReadOnly !== false && !hideTriggers)) { trigger.setVisible(!readOnly); } } } }, });