Question

I’m trying to create a grid that has a store with a PagingMemoryProxy in Ext JS 4.0.7. I’d like to be able to edit the information in the store, but I’m finding that if I edit the information and go to the next page, I lose the edited information on the previous page. My code is as follows.

Ext.Loader.setConfig({
  enabled: true
});

Ext.Loader.setPath('Ext.ux', 'examples/ux');

Ext.require('Ext.ux.data.PagingMemoryProxy');

Ext.onReady(function() {
  var data = [
    {name: 'jack johnson', text: 'record1'},
    {name: 'jack johnson', text: 'record2'},
    {name: 'jack johnson', text: 'record3'},
    {name: 'jack johnson', text: 'record4'}
  ];

  var store = Ext.create('Ext.data.Store', {
    fields: ['name', 'text'],
    data: data,
    proxy: {
      type: 'pagingmemory'
    },
    pageSize: 2
  });

  var grid = Ext.create('Ext.grid.Panel', {
    store: store,
    region: 'center',
    id: 'thegrid',
    plugins: [{
      ptype: 'cellediting',
      clicksToEdit: 1,
      listeners: {
        edit: function(editor, e) {
          //e.record.commit();
        }
      }
    }],
    columns: [{
      text: 'Name',
      dataIndex: 'name',
      editor: {
        allowBlank: false
      }
    }, {
      text: 'Text',
      dataIndex: 'text'
    }],
    dockedItems: [{
      xtype: 'pagingtoolbar',
      store: store,
      dock: 'bottom',
      displayInfo: true
    }],
  });

  Ext.create('Ext.Viewport', {
    layout: 'border',
    items: [grid]
  });
});

I was wondering how I could sync up my store’s data with the proxy’s data because the store’s data actually contains the records, whereas the proxy’s data contains the record’s data, so it’s impossible to find a record by id in the proxy. I decided to the give the sync method a try.

After using the sync method, nothing seemed to happen, so I thought maybe I should commit the record… hence the commented out e.record.commit code. When that didn’t do anything, I started digging around in Firebug and eventually saw on line 44,600 in ext-all-debug the me.getNewRecords code. This eventually led me to only returning the records that weren’t commited (because it apparently checks the record’s phantom property), thus, any record I edited would not be included in the toCreate variable on line 44,600.

When I took out the e.record.commit, the toCreate variable now contained the edited records, but none of this helped solve my problem… just initial poking around and what I found.

So my question is, how does one sync a store with a PagingMemoryProxy? Is it possible? If so, what do I do?

Any help would be appreciated!

Answer 1

Solved the problem by looping through the JSON data that I eventually add to the PagingMemoryProxy… basically added an “index” value to each record in the JSON, so when I want to edit the record in the store, I can easily index into its PagingMemoryProxy by using this index value. Simple fix.