title: Saving edited record in a cell editing grid
body: <p>How can I save the edited record on click of the save button? </p>
  
  <p><img src="https://i.stack.imgur.com/xqICU.png" alt="enter image description here"></p>
  
  <p>my code :</p>
  
  <pre><code>// create the Data Store
  var store = Ext.create('Ext.data.Store', {
      //autoSync: true,
      autoLoad:true,
      autoDestroy: true,
      url: 'update_premise.php',
      model: 'Plant',
      proxy: {
          type: 'ajax',
          // load remote data using HTTP
          url: 'getLab.php',
          // specify a XmlReader (coincides with the XML format of the returned data)
          reader: {
              type: 'json'
          },
            writer: {
              type: 'json'
  
          }
      },
      sorters: [{
          property: 'lab_name',
          direction:'ASC'
      }]
  });
  
  var cellEditing = Ext.create('Ext.grid.plugin.CellEditing', {
      clicksToEdit: 1
  });
  
  // create the grid and specify what field you want
  // to use for the editor at each header.
  var grid = Ext.create('Ext.grid.Panel', {
      store: store,
      columns: [{
          id: 'lab_name',
          header: 'Common Name',
          dataIndex: 'lab_name',
          flex: 1,
          editor: {
              allowBlank: false
          }
      }],
      selModel: {
          selType: 'cellmodel'
      },
      renderTo: 'editor-grid',
      width: 600,
      height: 300,
      title: 'Lab?',
      frame: true,
      tbar: [
       {
           text: 'Save',
           handler: function ()
           {
                 for (var i = 0; i &lt;grid.store.data.items.length; i++) {
                   var record = grid.store.data.items [i];
                   if (record.dirty) {
                   }
               }
           }
       }
       ],
      plugins: [cellEditing]
  });
  </code></pre>