Как работает редактирование ячейки с менеджером магазина extjs?

Question

У меня есть этот пример кода из Sencha's website

Ext.onReady(function() 
{ 
    Ext.create('Ext.data.Store', { 
     storeId:'simpsonsStore', 
     fields:['name', 'email', 'phone'], 
     data:{'items':[ 
      {"name":"Lisa", "email":"lisa@simpsons.com", "phone":"555-111-1224"}, 
      {"name":"Bart", "email":"bart@simpsons.com", "phone":"555-222-1234"}, 
      {"name":"Homer", "email":"home@simpsons.com", "phone":"555-222-1244"}, 
      {"name":"Marge", "email":"marge@simpsons.com", "phone":"555-222-1254"} 
     ]}, 
     proxy: { 
      type: 'memory', 
      reader: { 
       type: 'json', 
       root: 'items' 
      } 
     } 
    }); 

    Ext.create('Ext.grid.Panel', { 
     title: 'Simpsons', 
     store: Ext.data.StoreManager.lookup('simpsonsStore'), 
     columns: [ 
      {header: 'Name', dataIndex: 'name', editor: 'textfield'}, 
      {header: 'Email', dataIndex: 'email', flex:1, 
       editor: { 
        xtype: 'textfield', 
        allowBlank: false 
       } 
      }, 
      {header: 'Phone', dataIndex: 'phone'} 
     ], 
     selType: 'cellmodel', 
     plugins: 
     [{ 
      ptype: 'cellediting', 
      clicksToEdit: 1 
     }], 
     height: 200, 
     width: 400, 
     renderTo: 'grid' 
    }); 

}); 

Этот ptype: 'cellediting' плагин позволяет редактировать встроенные ячейки, просто нажав на textfield. Я просто не могу найти сообщений о , как и где сохраняется измененное значение? Как добавить слушателя в ячейку, чтобы после каждого изменения я смог alert() новое значение?

Спасибо за любые советы ...

Answer 1

Значения записи обновляются каждый раз, когда редактор размыто (т.е. теряет фокус). Ext отслеживает поля в записях, которые были изменены, пока вы не зафиксируете изменения (например, путем синхронизации хранилища).

Для того, чтобы получать уведомление, что поле редактировалось, используйте событие edit для плагина. Как вы можете видеть в документе, вы можете установить прослушиватель для этого события непосредственно в сетке (нет необходимости добавлять слушателя специально к плагину).

Редактировать

С вашим кодом, что бы что-то вроде этого:

Ext.create('Ext.grid.Panel', { 
    title: 'Simpsons', 
    store: Ext.data.StoreManager.lookup('simpsonsStore'), 
    columns: [ 
     {header: 'Name', dataIndex: 'name', editor: 'textfield'}, 
     {header: 'Email', dataIndex: 'email', flex:1, 
      editor: { 
       xtype: 'textfield', 
       allowBlank: false 
      } 
     }, 
     {header: 'Phone', dataIndex: 'phone'} 
    ], 
    selType: 'cellmodel', 
    plugins: 
    [{ 
     ptype: 'cellediting', 
     clicksToEdit: 1 
    }], 
    height: 200, 
    width: 400, 
    renderTo: 'grid', 

    listeners: { 
     edit: function(editor, e) { 
      var record = e.record; 

      alert(Ext.String.format(
       'The field "{0}" or record #{1} has been changed from {2} to {3}', 
       e.field, record.get('id'), e.originalValue, e.newValue 
      )); 

      alert('The following fields of the records are dirty: ' + Ext.Object.getKeys(record.modified).join(', ')); 
     } 
    } 
});