View Full Version : How do I prompt Yes/No on row editor validation?

14 Nov 2013, 3:44 PM
I'm using a rowEditor for a grid and want the validateEdit to confirm a special type of change that I flag on the record which might have cascading effects the user might not want in their data. Prior to 4.2.2 I did this:

// editor is the rowEditor.
editor.on('validateedit', function(editor, e){
console.log('rowEditor validateedit');
/* e has these props
grid - The grid
record - The record being edited
field - The field name being edited
value - The value for the field being edited.
row - The grid table row
column - The grid Column defining the column that is being edited.
rowIdx - The row index that is being edited
colIdx - The column index that is being edited
cancel - Set this to true to cancel the edit or return false from your handler.
// TODO: We possibly need to check for various permutations of date changes which can also affect the custom contour.
if(editor.hasPromptedForCustomContour === false && e.record.get('customContoured') === true){
// Need to check if the totalFte or totalHours has changed.
var contourAffectingFieldValueChanged = false;
editor.dateFieldValueChanged = false;
var formItems = editor.getEditor().items.getRange();
for(var i=0, len=formItems.length; i<len; i++){
// it's only going to be one or the other field never both.
var currentField = formItems[i];
if(currentField.name === 'totalFte' || currentField.name === 'totalHours'){
contourAffectingFieldValueChanged = currentField.isDirty();
// only flag editor.dateFieldValueChanged = true if it hasn't already changed from false yet.
if((currentField.name === 'startDate' || currentField.name === 'endDate') && editor.dateFieldValueChanged===false){
editor.dateFieldValueChanged = currentField.isDirty();

if(contourAffectingFieldValueChanged === true){
editor.hasPromptedForCustomContour = true;
Ext.Msg.confirm( 'Change custom contoured allocation',
'This change will cause the allocation\'s custom contour to be replaced with an even contour. Do you want to continue?', function(buttonId){
if(buttonId == 'yes'){
editor.completeEdit(); // this will force another run thru the validateedit event.
}, window );
// always return false to cancel it. yes will programmatically complete the edit.
// if the dialog has been shown once then this will always return true on the second time thru.
return false;
return true;

Basically what I was doing to forcing a false on the validate if the contourAffectingFieldValueChanged === true, then the user is prompted with a Yes/No, and a callback on the Yes completes the edit programmatically.

The issue now is the validateEdit method in RowEditing.js now sets the this.editing to false if the validateEdit event handler returns false so you can't keep the editor open this way.

How might I do something like this in 4.2.2 now?

1. I want to process the potential changes when they click the Update button.
2. I will prompt them if its something warning worthy.
3. If they confirm the prompt I will complete the edit and the row editor goes away.