Dynamic Model with ExtJS 4

extjs, extjs4

Solution

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.

Problem

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!

Original source