ComboBox with ForceSelection does not do validation correctly

[anton.stepan]

Hi,

ExtJs Version: 5.1.1

Fiddle: https://fiddle.sencha.com/#fiddle/n6j

ComboBox with 'allowBlank: false' and 'forceSelection: true' is not displaying empty value is invalid.

Reproducing the bug

- goto fiddle
- (combobox is correctly marked as invalid, as no value is selected)
- click inside the combo and type 'xxxxxx'
- now either Tab out of the box, or just click somewhere outside
=> combobox has no value, but is marked as valid

[Gary Schlosberg]

Thanks for the report! I have opened a bug in our bug tracker.

[anton.stepan]

For anyone interested in a quick and dirty workaround:

Blur Callback of the Combobox

blur: function(self) {
    if (!this.allowBlank && this.getValue() === null) {
        this.markInvalid('This field is required.');
    }
}

[SpecialAgent]

This Bug is still existing in ExtJS 6.5.3!

I use this as workaround:

listeners: {
   afterrender: function(combo){
      combo.validate();
   }
}

[grant-humphries]

This override has resolved the issue for me so far:

    override: 'Ext.form.field.ComboBox',

    initComponent: function () {
        this.callParent();

        if (this.allowBlank === false && this.forceSelection === true) {
            this.on({
                blur: function () {
                    if (Ext.isEmpty(this.getValue())) {
                        this.wasValid = false
                    }
                }
            })
        }
    }