web-dev-qa-db-fra.com

ExtJS 4 Changer de magasin de grille à la volée

Est-il possible de changer le magasin de la grille dans ExtJS 4?

Par exemple, j'ai deux modèles:

User = Ext.define('User',{
  extend: 'Ext.data.Model',
  [...],
  hasMany: 'Product'
});

Product = Ext.define('Product',{
  extend: 'Ext.data.Model',
  [...]
});

et deux grilles. La première grille est liée à Store qui utilise le modèle User et charge les données json imbriquées depuis le backend, comme

{
  users: [{
     id: 1,
     products: [
       {id: 1},
       {id: 2}
     ]
  }, {
     id: 2,
     products: [
       {id: 3},
       {id: 4},
       {id: 5}
     ]
  }]
}

Tout ce que je veux obtenir, c'est lorsque vous cliquez sur la ligne de la première grille, la deuxième grille doit montrer les produits de l'utilisateur, sans connexion au serveur. Tout ce que je sais, c'est que user.products(); renvoie un objet Ext.data.Store. L'idée est donc de changer le magasin de la deuxième grille en user.products();, mais il n'y a pas une telle méthode grid.setStore() :-)

Merci d'avance

extjsgridextjs4
25
sunsay

Je pense qu'une meilleure solution serait de:

     grid1.on('itemclick', function(view, record) {
         grid2.reconfigure(record.products());
     );
36
pllee

Vous regardez les magasins dans le mauvais sens. Un magasin est attaché à la grille pour toujours, il n'y a donc pas de grid.setStore(). Vous ne modifiez PAS un magasin pour une grille, au lieu de cela, vous modifiez les données dans le magasin pour cette grille.

Maintenant, solution à votre problème: Vous avez raison avec la partie que vous avez déjà une instance de stockage avec vos données. c'est à dire; user.products(). Pourtant, vous devrez créer un magasin pour votre grille. Ce magasin n'aura cependant aucune donnée. Maintenant, lorsque vous devez afficher des informations sur les produits, vous devez charger le magasin de la grille avec des données. Vous pouvez utiliser:

  • charge()
  • loadData ()
  • loadRecord ()

pour charger des données dans votre magasin. Dans votre cas, vous pouvez effectuer les opérations suivantes:

myStore = user.products();
grid.getStore().loadRecords(myStore.getRange(0,myStore.getCount()),{addRecords: false});
20
Abdel Raoof

Si vous souhaitez attacher un magasin à une grille après la création de la grille, vous pouvez utiliser la méthode bindStore () .

var store = user.products();
grid.getView().bindStore(store);

Vous pouvez également utiliser les méthodes load (), loadData (), loadRecords () et copier les données dans votre magasin.

9
Sasha Brocato

La réponse d'Abdel Olakara m'a aidé lorsque j'ai eu besoin de mettre à jour des données sur quelque chose qui n'avait pas reconfigure (classe personnalisée héritant de Ext.form.FieldSet).

Mais vous n'avez pas besoin de spécifier addRecords ou la plage de getRange, car les valeurs par défaut nous ont couvert dans ce cas.

Cela signifie que vous pouvez faire:

myStore = user.products();
grid.getStore().loadRecords(myStore.getRange());
3
Nick Knowlson