Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Dynamic Model with ExtJS 4

Tags:

extjs

extjs4

With ExtJS 3.x, I was able to use the "fields" property of a Store, but it seems with ExtJS 4 I have to absolutely use a Model. It's fine, but in my case, it's not a static Model, and I need to define the fields on the fly and sometimes to change them.

I could re-create a Model, but I need to use a different name as it's apparently not possible to modify an exisiting Model, neither delete it. If I try to use Ext.regModel with the same name, ExtJS crashes.

Thanks for your help!

like image 763
TigrouMeow Avatar asked Apr 22 '11 00:04

TigrouMeow


2 Answers

4.1 UPDATE:

As an update... in 4.1 there is now a static method setFields which can be used to define the model prototype fields. It works well in a controller's init method.

When I did this, I wanted to have some static fields defined in the model class and then set some more dynamically. Unfortunately the new setFields method replaces all fields with the argument, it was easy enough to handle though.

This example uses the MVC pattern where my model and store are included in the controller's model array and store array (providing me with the handy getters used below):

Ext.define('ST.controller.Main', {     extend: 'Ext.app.Controller',      models: ['User', 'Reference'],      stores: ['CurrentUser', 'PermissionRef'],      views: ['MainPanel'],      init: function() {         var me = this;          me.getPermissionRefStore().on('load', function(store, records) {             var model = me.getUserModel();                 // this returns the static fields already defined                  // in my User model class                 fields = model.prototype.fields.getRange();              // add the permission options (dynamic fields) to the static fields             Ext.each(records, function(permission) {                 fields.push({name: permission.get('name'), type: 'bool'});             });              // 4.1 method to update the User model fields             model.setFields(fields);              // now load the current user (it will use the updated model)             me.getCurrentUserStore().load();          });      }  }); 

The User model and CurrentUser store are created exactly like regular, non-dynamic models and stores would be and included in their respective controller arrays, the 'User' model is simply missing the dynamic fields which are added as shown above.

like image 99
egerardus Avatar answered Sep 28 '22 16:09

egerardus


I also went into that problem. I have a service which is responsible for fetching metadata from the server and adapting the models and stores to this metadata.

I therefore defined an empty model and configured the store to use this model.

When the meta data is processed, I add the new/additional fields to the prototype of the model like this (metaDataStore is the store containing the meta data, model is the model which can be obtained from the model manager):

var fields = []; metaDataStore.each(function(item) {     fields.push(Ext.create('Ext.data.Field', {         name: item.get('field')     })); }); model.prototype.fields.removeAll(); model.prototype.fields.addAll(fields); 

When I then call load on a store using this model or create new model instances the new fields are processed correctly.

like image 25
frow Avatar answered Sep 28 '22 18:09

frow