PDA

View Full Version : Completely custom validation



448191
4 Oct 2009, 3:27 PM
Hi all,

I want to use completely custom validator objects, because vtypes are too limited and I want to reuse the validators I use for other projects.

Unfortunately customizing ExtJS to work with completely custom validators is a lot trickier than I had hoped. I did the following, which does work to a degree, but it sets the "valid" flag on the form field, which is apparently reused in a an editor grid (and perhaps in forms as well?), making it useless:


Ext.override(Ext.form.Field, {
valid: true,
validationDelay : 500,
getValidator: function(){

if(this.validator){
return this.validator;
}

if(!this.vParams){
return null;
}

this.validator = kwd.jquery.validation.factory(this.vParams);

return this.validator;
},
fireEvent: function(){
//Stop any default action on valid/invalid
if(arguments[0] === 'valid' && !this.valid){
return false;
}
if(arguments[0] === 'invalid' && this.valid) {
return false;
}

Ext.form.Field.superclass.fireEvent.apply(this, arguments);
}
});

Ext.override(Ext.form.TextField, {

validateValue: function(value){

var validator = this.getValidator();

if(!validator){
return true;
}

this.valid = validator.validate(value);

/**
* Reparse the message template
*/
validator.parseTemplate();

if(!this.valid) {
this.markInvalid(validator.message());
}

return true; //Stop any default action on invalid
}
});If I let validateValue() return false when invalid, the grid reverts the value. I want the invalid value to be used, and deal with the invalid value later, as for example with this grid plugin:


kwd.ext.jquery.GridValidator = function(config) {

this.focusInvalid = true;

Ext.apply(this, config);

this.init = function(grid) {

grid.addEvents(
'valid', 'invalid'
);

if(this.focusInvalid){
grid.on('invalid', function(col, row){

grid.startEditing(row, col);
});
}

/**
* Fires after editing a cell
*
* @param {Object} event
*/
grid.on('afteredit', function(event){
/**
* Check the status of the whole form
*/
event.grid.isValid();
});

Ext.apply(grid, {
/**
* Check if the currently active part of the grid has no fields marked as invalid
*
* @return {Boolean}
*/
isValid:function()
{
try {
var colCount = this.colModel.getColumnCount();
var rowCount = this.store.getCount();
var row, col;

for (row = 0; row < rowCount; ++row) {

for (col = 0; col < colCount; ++col)
{
console.log("col " + col + " row " + row);

if (!this.colModel.isCellEditable(col, row)) {
continue;
}

var editor = this.colModel.getCellEditor(col, row);

if (!editor) {
continue;
}

if (!editor.field.valid) {

this.fireEvent('invalid', col, row);
return false;
}
}
}

this.fireEvent('valid');

return true;
}
catch(e){
kwd.ext.triggerException(e);
}
}
});
};
}; This is when the problem became apparent: when a cell is invalid, it always brings focus to the first editor in the column: row is always 0. I am assuming this is because "editor" is actually the same object for all cells in a column, which makes sense but really screws my plans.

Any ideas? Maybe set the valid flag on the record?

448191
7 Oct 2009, 12:47 AM
*bump*