Can't make allowBlank true visually in ExtJS

Question

I have textfield:

{
                xtype : 'textfield',
                id: 'specialCode',
                allowBlank: true,
                fieldLabel : 'Special Code',
                name : 'specialCode'
            }

I do make it required when a checkbox is checked with

Ext.getCmp('specialCode').allowBlank = false;
Ext.getCmp('specialCode').validateValue(Ext.getCmp('specialCode').getValue());

I becomes red and it becomes required.

Then when another checkbox is cheked I use this code

Ext.getCmp('specialCode').allowBlank = true;

It becomes not required but the red border does not go away. I need to click the field and some other place in order to remove the red border.

Answer 1

use clearInvalid on the field too to reset it's invalidation style.

Ext.getCmp('specialCode').allowBlank = true;
Ext.getCmp('specialCode').clearInvalid();