extjs - ExtJS の編集可能なグリッドのデータを json ファイルに保存し、グリッドを変更して更新するにはどうすればよいですか?

Question

ExtJS に編集可能なグリッドがあります。json ファイルからデータを取得し、編集後にデータを保存しようとしています。編集後、保存をクリックして Store.sync() を呼び出しますが、JSON ファイルは変更されず、グリッドは編集前の状態に更新されます。私はExtJSの初心者です。ここで何が欠けていますか、それを機能させるにはどうすればよいですか?

    Ext.define('User', {
    extend: 'Ext.data.Model',
    fields: [ 
          {name: 'Pricelist', type: 'string'},
          {name: 'Productfamily', type:'string'},
          {name: 'Producttype', type:'string'},
          {name: 'Productsubgroup', type: 'string'},
          {name: 'Item', type: 'string'},
          {name: 'Level', type: 'string'},
          {name: 'Factor', type:'string'},
          {name: 'Factorvalue', type: 'string'},
          {name: 'Effstrtdate', type: 'string'},
          {name: 'Effenddate', type: 'string'},
          {name: 'Comments', type: 'string'}             
        ]
    });

    var userStore = Ext.create('Ext.data.JsonStore', {
    model: 'User',
    proxy: {
       type: 'ajax',
       url: '/pwbench/form/products/fctrmgmt/data.json',
       api: {
        read: '/pwbench/form/products/fctrmgmt/data.json',
            update: '/pwbench/form/products/fctrmgmt/data.json'
       }, 
       reader: {
            type: 'json',
       }
    },
    autoLoad: true

    });

    var grid = Ext.create('Ext.grid.Panel', {
    renderTo: Ext.getBody(),
    store: userStore,
    title: 'Application Users',
    selType: 'cellmodel',
    plugins: [
        Ext.create('Ext.grid.plugin.CellEditing', {
        clicksToEdit: 1
        })
    ],
    columns: [....      
    ],
    tbar: [
       {
           text: 'Save',
           handler: function() {
               userStore.sync();
               userStore.load();

           }
       }
    ],
    });

    Ext.application({
   requires: ['Ext.container.Viewport'],
       name: 'ExtGrid',
       launch: function() {
            Ext.create('Ext.container.Viewport', {
            items: grid,
            width: 800,
            height: 600
       });

    }
    });