Following code uses validator config of textfield in ExtJs:
Ext.onReady(function(){
Ext.create('Ext.form.Panel', {
title: 'Simple Form',
width: 350,
url: 'save-form.php',
layout: 'anchor',
defaults: {
anchor: '100%'
},
defaultType: 'textfield',
items: [{
fieldLabel: 'First Name',
validateOnBlur:true,//calling validator on blur
validateOnChange:false,//not calling validator on change
validator:function(){
console.log('in validator');//printing to console whenever validator is called
return true;
}
}],
renderTo: Ext.getBody()
});
});
In the code, validateOnBlur is set to true where as validateOnChange is set to false.
The issue is that when user focusses the field for the first time and blurs out, then the validator function gets fired twice as shown in the screenshot attached.
If the user agains focusses the field second time, and blurs, then the validator gets fired only one and same is true for all the subsequent such actions.
But for the first time, when user focusses the field and blurs (either by mouse click or tab out) then the validator function gets fired twice.
Could anyone guide that what can be the possible reason behind this and how can this be stopped or is this a bug in version 4.1 of ExtJs?
Thanks in advance