Comment stocker des données locales dans Sencha Touch/PhoneGap?

Question

J'ai configuré une application SenchaTouch/PhoneGap qui extrait des informations d'un flux XML externe. Mon problème est que cela ne fonctionnera évidemment qu'en ligne.

Comment puis-je stocker les informations du flux externe dans le stockage local pour les utiliser hors connexion?

Voici les données d'applications magasin code:

App.eventstore = new Ext.data.Store({ 
    model: 'Event', 
    sorters: 'title', 
    autoLoad: true, 

    getGroupString : function(record) { 
     return record.get('title')[0]; 
    }, 

    proxy: { 
     type: 'ajax', 
     url: 'http://the-url-to-the-file.xml', 
     reader: { 
      idProperty: 'id', 
      type: 'xml', 
      root: 'events', 
      record: 'event' 
     } 
    } 
}); 
App.eventstore.read();

mise à jour après la réponse de Ilya139:

J'ai mis en place le code, mais maintenant ma liste est vide ... : (

Boutique

App.eventstore = new Ext.data.Store({ 
    model: 'Event', 
    sorters: 'title', 
    autoLoad: true, 

    getGroupString : function(record) { 
     return record.get('title')[0]; 
    }, 

    proxy: { 
     type: 'ajax', 
     url: 'http://the-url-to-the-file.xml', 
     reader: { 
      idProperty: 'id', 
      type: 'xml', 
      root: 'events', 
      record: 'event' 
     } 
    } 
}); 

App.eventstore.read(); 

App.eventstore.each(function(record){record.save();}); 

App.offlineeventstore = new Ext.data.Store({ 
    model: 'Event', 
    sorters: 'title', 
    autoLoad: true, 

    getGroupString : function(record) { 
    return record.get('title')[0]; 
    }, 

    proxy: { 
     type: 'localstorage', 
     id:'events' 
    } 
}); 

App.offlineeventstore.read();

Modèle

Ext.regModel('Event', { 
    fields: [ 
     {name: 'id', mapping: '@id', type: 'integer'}, 
     {name: 'title', type: 'string'}, 
     etc etc... 
    ], 

    proxy: { 
     type: 'localstorage', 
     id:'events' 
    } 

});

Et la liste est configuré pour utiliser le magasin en ligne:

items: [{ 
     xtype: 'list', 
     store: App.offlineeventstore, 
     itemTpl: '{title}', 
     grouped: true, 
     indexBar: true, 

Answer 1

Ajouter ce au modèle Event:

proxy: { 
     type: 'localstorage', 
     id:'events' 
    } 

Et puis pour chaque événement à vous téléchargez appel save() comme ceci:

App.eventstore.each(function(record){record.save();}); 

ensuite à la charge:

App.offlinestore = new Ext.data.Store({ 
    model: 'Event', 
    sorters: 'title', 
    autoLoad: true, 

    getGroupString : function(record) { 
    return record.get('title')[0]; 
    }, 
    proxy: { 
     type: 'localstorage', 
     id:'events' 
}}); 

Mise à jour

App.eventstore.load(function(){ 
    App.eventstore.each(function(record){record.save();}); 
    offlineeventstore.load(); 
});