PDA

View Full Version : Define event for validator function



extjser12
17 Feb 2012, 6:57 AM
Hello together

Can somebody help me how can I set the event for the validation function (http://docs.sencha.com/ext-js/4-0/#%21/api/Ext.form.field.Text-cfg-validator)?
I'd like to fire this function at the "blur-event".



validator: function(){
if (this.textValid) {
return true;
} else {
return false;
}
},
listeners: {
blur: function() {
// Call validator function
}


Thanks for your help!

mitchellsimoens
17 Feb 2012, 7:14 AM
try executing isValid on the field.

extjser12
17 Feb 2012, 8:24 AM
Can you explain me this in more detail? Maybe with an example. In the function of the blur event I'll do an ajax request.

Thank you!

mitchellsimoens
17 Feb 2012, 8:27 AM
field.isValid()

extjser12
19 Feb 2012, 11:52 AM
field.isValid() seems not to work.

As you can read in the documentation the "markInvalid()" method doesn't change the validity of the field. As a result the "isValid()" method returns always true, althought the field was set before as invalid (with "markInvalid()" method).
See also the following code:



Ext.create('Ext.form.Panel', { title: 'Simple Form',
bodyPadding: 5,
width: 350,


// Fields will be arranged vertically, stretched to full width
layout: 'anchor',
defaults: {
anchor: '100%'
},


// The fields
defaultType: 'textfield',
items: [{
fieldLabel: 'First Name',
name: 'first'
},{
fieldLabel: 'Last Name',
name: 'last',

// My inserted code
listeners: {
blur: function(field, value) {
if (field.getValue() == '') {
field.markInvalid('Invalid');
field.isValid();
}
}
}
}],


// Reset and Submit buttons
buttons: [{
text: 'Reset',
handler: function() {
this.up('form').getForm().reset();
}
}, {
text: 'Submit',
formBind: true, //only enabled once the form is valid
disabled: true
}],
renderTo: Ext.getBody()
});


How can I change the above code, so that it affects the validity of the form itself? Accordingly the "formBind: true" config will work as expected (when the field is marked as invalid the is disabled).

Can somebody help me?

Note: I don't want to implement this with "allowBlank: false" or "vtype" because these will be fired on every change of the field and "vtype" doesn't work with Ajax requests(?).

Thank you very much and regards
extjser12