PDA

View Full Version : [2.0b1] validateOnBlur: false ignored in Ext.form.DateField



lkneschke
28 Oct 2007, 10:36 PM
Hello!

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.

mystix
28 Oct 2007, 10:54 PM
isn't the current behaviour correct?
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
}
}

jsakalos
30 Oct 2007, 2:11 PM
Thank you for posting, testing and pointing out the problem. Added to the list.