How to implemented a nested and associated model-json into selectfield in Sencha Touch?

Question

I have a store with associated model and I need to include values of this associated model into selectfield component in Sencha Touch.

Here my parent model:

    Ext.define('x.customer.model.CustomerModel', {
    extend: 'Ext.data.Model',
    requires:[
        'x.customer.model.CustomerTemplateModel'
    ],
    config: {
        useCache: false,
        idProperty: 'id',
        fields: [
            {
                name: 'id',
                type: 'string'
            },
            {
                name: 'address',
                type: 'string'
            },
            {
                name: 'name',
                type: 'string'
            },
            {
                name: 'type',
                type: 'int'
            }
        ],
        associations: [
            {
                type: 'hasMany',
                associatedModel: 'Survey.customer.model.CustomerTemplateModel',
                ownerModel: 'Survey.customer.model.CustomerModel',
                associationKey: 'templates',
                autoLoad: true,
                name: 'templates'
            }
        ]
    }
});

and the children model:

Ext.define('x.customer.model.CustomerTemplateModel', {
    extend: 'Ext.data.Model',
    requires:[],
    config: {
        useCache: false,
        rootProperty: 'templates',
        fields: [
            {
                name: 'text',
                type: 'string'
            },
            {
                name: 'value',
                type: 'string'
            }
        ]
    }
});

store:

requires: ['Survey.customer.model.CustomerModel'],

config: {
    model: 'Survey.customer.model.CustomerModel',

    proxy: {
        type: 'ajax',
        reader: {
            type: 'json',
            rootProperty: 'customers'
        }
    }
}

Currently the json has this structure:

{
  "id": "00000001",
  "address": "Antsy Road",
  "name": "asfas",
  "phone": "55555",
  "openSurveys": 7,
  "templates": [
    {
      "text": "123",
      "value": "Template 1"
    }
  ],
  "type": 1,
  "withSurveys": true
},

how to implement data included in the "templates" nested json in a selectfield?

thank you in advance

Benoit Cuvelier · Accepted Answer · 2015-09-17T15:05:59.410

1

Once your store loaded and if you have one custommer:

var templatesData = []; // What will be inserted to the ComboBox
for (var i=0; i < custommers[0].get('templates').length; i++) { // Running threw the values and populating templatesData 
    var templateModel = custommers[0].get('templates')[i];
    var templateCombo = { 
          text: templateModel.data.text, 
          value: templateModel.data.value
   };

    templatesData.push(templateCombo); 
}
// Setting the values to the combobox 
Ext.getCmp('myCombo').setStore(Ext.create("Ext.data.Store", { 
     model: 'x.customer.model.CustomerTemplateModel', 
     data :templatesData 
}));

This is not a unique solution, you could create a new instance of store as well. Here is more information about how setting the "store" property for a combobox : http://docs.sencha.com/extjs/4.1.3/#!/api/Ext.form.field.ComboBox-cfg-store

edited Sep 17 '15 at 15:05

answered Sep 17 '15 at 12:16

Benoit Cuvelier

806
7
23

and in this case, what is "myObject"? – inane Sep 17 '15 at 12:57
An instance of "x.customer.model.CustomerModel" – Benoit Cuvelier Sep 17 '15 at 12:58
"x.customer.model.CustomerModel" is the name you gave to your parent model right ? This model has many "x.customer.model.CustomerTemplateModel", so you need to loop this data to populate your combo :) I edited my answer to be more precise – Benoit Cuvelier Sep 17 '15 at 13:00
Ok , I understand, but How to get data of this parent model? – inane Sep 17 '15 at 13:37
When you load your store I guess ? – Benoit Cuvelier Sep 17 '15 at 13:38
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/89921/discussion-between-inane-and-benoit-cuvelier). – inane Sep 17 '15 at 13:38

How to implemented a nested and associated model-json into selectfield in Sencha Touch?

1 Answers1