[2.0.2] EditorGridPanel - afteredit event not firing when leaving cell unchanged.

[KevinChristensen]

I need to know when a user has started to edit a cell, using beforeedit, and then when that user leaves the cell, afteredit. The beforeedit always fires as expected but the afteredit does not fire if the user leaves the cell without changing the value. Is this a bug or did I misunderstand the purpose of the afteredit event? I understand the value has not been modified but I need to know if the user is currently in edit mode but you will never know they left edit mode if you are waiting for the afteredit event.

[KevinChristensen]

I guess nobody else has attempted this and thought I'd include a small example which should work on any EditorGridPanel. The beforeedit fires as expected when I double click the cell. The afteredit event only fires if the value was changed. I expected the afteredit event to fire every time the user leaves the edit mode for a cell regardless if the cell was modified or not.

    newGrid=new Ext.grid.EditorGridPanel({
            title:'Sample Grid',
            ds:myStore,
            cm:myColumnModel,
            selModel:new Ext.grid.RowSelectionModel({singleSelect:true}),
            frame:true,
            height:200,
            width:985,
            stripeRows:true,
            trackMouseOver:true,
            loadMask:true
    });

    newGrid.on({
       beforeedit:function(e){ console.info('beforeedit';return true; },
       afteredit:function(e){ console.info('afteredit');return true; }
    }); 

I hope this is enough information for someone to help me.

[dashasalo]

I am having the same problem. Did you find a solution?

[KevinChristensen]

This is how I got around the problem. I'm currently using ExtJS 3.2.1. Placing this listener on your grid should work. Good luck.

/**
   * We always want validateedit and afteredit events to fire, so fix it so they do.
   * This allows us to have a listener on the grid to know when the user has left
   * a field after beginedit had fired.  Normally the aferedit event only gets fired
   * if the user actually made changes and clicked somewhere else on the grid.
   * Now if fires if the user clicks somewhere else like another grid.
   *
   * @param ed
   * @param value
   * @param startValue
   */
  onEditComplete: function(ed, value, startValue){
    this.editing = false;
    this.activeEditor = null;
    ed.un("specialkey", this.selModel.onEditorKey, this.selModel);
    var r = ed.record;
    var field = this.colModel.getDataIndex(ed.col);
    // Setup the object to be passed to the validateedit event.
    var e = {
      grid: this,
      record: r,
      field: field,
      originalValue: startValue,
      value: value,
      row: ed.row,
      column: ed.col,
      cancel:false
    };
    if(this.fireEvent("validateedit", e) !== false && !e.cancel){
      r.set(field, value);
      delete e.cancel;
      this.fireEvent("afteredit", e);
    }
    this.view.focusCell(ed.row, ed.col);
  } 

[dashasalo]

Thank you!

[murrah]

Placing this listener on your grid should work. Good luck.

Thanks for this. Can you be more specific about how to use this please? eg using your sample code in post #2 above.

Thanks,
Murray