title: Adding an empty row to a grid
body: <p>I am trying to add rows to my grid.</p>
  
  <p>I saw an example in the docs:</p>
  
  <pre><code>onAddRouteClick: function(){
  // Create a model instance
  var rec = new KitchenSink.model.grid.Plant({
      buying_vendor_id: 12,
      country_code: '1',
      route: 0
  });
  
  this.getStore().insert(0, rec);
  this.cellEditing.startEditByPosition({
      row: 0, 
      column: 0
  });
  </code></pre>
  
  <p>}</p>
  
  <pre><code>this.getStore().insert(0, rec);
  this.cellEditing.startEditByPosition({
      row: 0, 
      column: 0
  });
  }
  </code></pre>
  
  <p>But i cant seem to make it work in my code.</p>
  
  <p>This is my grid:</p>
  
  <pre><code>onBtnRoutesSearchClick: function(button, e, options){
      var me = this;
      var v_url = 'GetRoutes.jsp?' + Ext.urlEncode({'route_id': routeID, 'route_country_code' : routeCountryCode , 'route_vendor_id' : routeVendorID});
  
      var newTab = Ext.create('Ext.panel.Panel', {
      id: 'routes_pannel',
      title: 'Routes',
      autoScroll: true,
      layout: {
          type: 'fit'
      },
      closable: true,
      dockedItems: [
          {
              xtype: 'toolbar',
              dock: 'top',
              items: [
                  {
                      xtype: 'button',
                      id: 'buttonResetBid',
                      icon: 'images/Plus.png',
                      text: 'Add Row',
                      listeners: {
                          click: {
                              fn: me.onAddRouteClick,
                              scope: me
                          }
                      }
                  }
              ]
          }
      ],
      items:  [{
          id: 'routes_grid',
          xtype: 'gridpanel',
          autoShow: false,
          autoScroll: true,
          store:  Ext.create('Ext.data.Store', {
              fields:[
              {name: 'buying_vendor_id', type: 'int', sortType: 'asInt'},
              {name: 'country_code', type: 'int', sortType: 'asInt'},
              {name: 'route', type: 'int', sortType: 'asInt'}
              ],
              proxy: {
                  type: 'ajax',
                  timeout: 120000,
                  url: v_url,
                  reader: {
                      type: 'json',
                      root: 'data',
                      successProperty: 'success'
                  }
              },
              autoLoad: true
          }),
          columns: [
              {
                  xtype: 'gridcolumn',
                  dataIndex: 'buying_vendor_id',
                  width: 100,
                  text: 'Buying Vendor'
              },
              {
                  xtype: 'gridcolumn',
                  dataIndex: 'country_code',
                  width: 100,
                  text: 'Country Code'
              },
              {
                  xtype: 'gridcolumn',
                  dataIndex: 'route',
                  width: 80,
                  text: 'Route'
              }
          ],
      }]
  });
  
  var panel = Ext.getCmp("MainTabPanelID");
  panel.add(newTab).show();
  </code></pre>