Press "Enter" to skip to content

Ext JS 4 – Set custom idProperty for DataStore when fields are given

In EXT JS 4 there still is a chance to pass only the fields and data directly to the DataStore when you construct it, instead of passing a model. Ext JS is then creating an internal model from the fields passed. Now, the problem is that Ext JS is going to append an identifier field ‘id’, if there is no field given with that name. If our identifier field has other name, like ‘customID’, then it causes a lot of trouble when it comes to getting the record with a given identifier (getById). Unfortunately there is no way to specify which field we’d like to use as identifier in this case.

I have come up with the following solution: I am building a temporary model on-the-fly from the fields. On this model I am able to specify which field I would like to use as identifier. Here is my method for creating a DataStore from the given fields and columns. You may notice, that in case the idProperty is not set, I am using the first column as identifier.

createDataStore: function (fields, data, idProperty) {  
    var dataStore = Ext.create('Ext.data.ArrayStore', {
        model: Ext.define('net.gazsi.laszlo.extjs.GenericModel' + Ext.id(), {
            extend: 'Ext.data.Model',
            fields: fields,
            idProperty: idProperty || fields[0].name
        }),
        data: data
    });

    return dataStore;
}