title: Extjs 4.0.7, Editor Grid - how to get updated cell value?
body: <p>I need to get(retrieve) updated cell value in controller. (MVC)</p>
  
  <p>So I tried this, </p>
  
  <pre><code>var modified = this.getItemGrid().getStore().getUpdatedRecords();
  console.log(modified); // return [] empty array
  
  var modified = this.getItemList_Store().getUpdatedRecords();
  console.log(modified); // return [] empty array
  </code></pre>
  
  <p>but always it returns empty array even I updated some cell value.</p>
  
  <p>anybody know what I am doing wrong?</p>
  
  <p>Here is my part of view code,</p>
  
  <pre><code>Ext.define("App.view.orders.ItemList_view", {
      extend: "Ext.grid.Panel",
      alias: "widget.itemList_view",
      plugins: [
              Ext.create('Ext.grid.plugin.CellEditing', {
                  clicksToEdit: 1
              })
      ],
      initComponent: function () {
          this.store = "ItemList_store";
          this.columns = [
              {
                  xtype: 'checkcolumn', text: "Ship", width: 50, dataIndex: "DR"
              },
              { header: "test", width: 100, dataIndex: "test",
                  editor: {
                      xtype : 'textfield'
                  }
              }
          ];
  
          this.selModel = Ext.create("Ext.selection.CheckboxModel");
          //this.selModel = Ext.create("Ext.selection.CellModel"); // It does not works either.
  
          this.callParent(arguments);
      },
      .
      .
      .
  </code></pre>
  
  <p>Thank you!</p>
  
  <p>[EDIT]</p>
  
  <p>Thank you very much for your answer! I have some more question about editor grid.</p>
  
  <p>Its much different from Ext3. so I'm very confusing now :(</p>
  
  <p><strong>Q1. How to collect edited record data (once click button)?</strong> </p>
  
  <p>the event fired once the grid cell be changed.
  but I want collect edited grid record once I click the 'Update edited cell' button, and I want to update all together at the once.</p>
  
  <p>In Ext3, I did like this,</p>
  
  <pre><code>(button) click : function(){
      var modified = mygridStore.getModifiedRecords();
  
      var recordsToSend = [];
      Ext.each(modified, function(record){
          recordsToSend.push(record.data);
      });
  
      var grid = Ext.getCmp('grid');
      grid.el.mask('Updating','x-mask-loading');
      grid.stopEditing();
  
      recordsToSend = Ext.encode(recordsToSend);
  
      Ext.Ajax.request({
          url : '/test/test',
          params : {
              data : recordsToSend
          },
          success : function(response){
              grid.el.unmask();
              alert(response.responseText);
              mygridStore.commitChanges();
          },
          failure : function(response){
              mygridStore.rejectChanges();
          }
      });
  }
  </code></pre>
  
  <p>How can I change the code for Extjs4 ?</p>
  
  <p><strong>Q2. I don't know still how to find out for changed checkcolumn.</strong></p>
  
  <p>I tried this, but I does not work for checkcolumn (of cause I tested after change checkbox)</p>
  
  <pre><code>// grid coumn
  {
   xtype: 'checkcolumn', header: "My Check Column", width: 50, dataIndex: "CH"
  }
  </code></pre>
  
  <p>-</p>
  
  <pre><code>// in control
  'myGrid': {
      validateedit: function (plugin, edit) {
          console.log(edit);
      },
      checkchange: function (plugin, edit) {
          console.log(edit);
          console.log(edit.value);
      }
  }
  </code></pre>
  
  <p><strong>Q3. When I click the cell to edit, the show some HTML tag in -_-;;</strong></p>
  
  <p><img src="https://i.stack.imgur.com/a9vwe.png" alt="enter image description here"></p>
  
  <p><strong><em>I really appreciate for your help. and thank you very much for your valuable time!</em></strong></p>