I'm using the latest public available version of ExtJS 2.0. I'm using following code snipped:
var dateFrom = new Ext.form.DateField({
id: 'adminApplications_dateFrom',
allowBlank: false,
validateOnBlur: false,
value: oneWeekAgo
});
Now i would expect to get a validation event, when a date get's modified by keyboard and get's set by the minicalendar, but NOT when the date inputfield loses his focus(onBlur) as validateOnBlur is set to false.
yup there's a bug.
new Ext.form.DateField({
id: 'adminApplications_dateFrom',
applyTo: 'date',
format: 'd/m/Y',
allowBlank: true,
validateOnBlur: false,
listeners: {
valid: function() {
console.log('event "valid" fired with the following arguments: ', arguments);
},
invalid: function() {
console.log('event "invalid" fired with the following arguments: ', arguments);
}
}
});
i.e. the valid / invalid events are only fired on keyup, not on blur.
[edit]
only the DateField's valid event is affected
if the DateField is valid, the valid event is fired twice on blur even when validateOnBlur = false (incorrect)
if the DateField is invalid, the invalid event is not fired on blur (correct)
the problem is DateField's beforeBlur() method (called by TriggerField's triggerBlur() method) calls DateField's setValue() method, which then bypasses Ext.form.Field's validateOnBlur check. DateField's setValue() method is only called from beforeBlur() when a valid date is returned by the parseDate() method, which is why only the valid event is fired as described above.
i've attached the call chain below
triggerBlur : function(){ // Ext.form.TriggerField's triggerBlur
this.mimicing = false;
Ext.get(Ext.isIE ? document.body : document).un("mousedown", this.mimicBlur);
if(this.monitorTab){
this.el.un("keydown", this.checkTab, this);
}
this.beforeBlur(); // this is where it all starts
this.wrap.removeClass('x-trigger-wrap-focus');
Ext.form.TriggerField.superclass.onBlur.call(this) ;
}
//************************************************** ****
beforeBlur : function(){ // Ext.form.DateField's beforeBlur
var v = this.parseDate(this.getRawValue());
if(v){
this.setValue(v);
}
}
//************************************************** ****
setValue : function(date){ // Ext.form.DateField's setvalue
Ext.form.DateField.superclass.setValue.call(this, this.formatDate(this.parseDate(date)));
}
//************************************************** ****
setValue : function(v){ // Ext.form.TextField's setvalue
if(this.emptyText && this.el && v !== undefined && v !== null && v !== ''){
this.el.removeClass(this.emptyClass);
}
Ext.form.TextField.superclass.setValue.apply(this, arguments);
this.applyEmptyText();
this.autoSize();
}
//************************************************** ****
setValue : function(v){ // Ext.form.Field's setvalue
this.value = v;
if(this.rendered){
this.el.dom.value = (v === null v === undefined ? '' : v);
this.validate(); // this is the problem
}
}
#If you have any other info about this subject , Please add it free.# |
