Question

My case is, I have an edit form, that gets its data from a selected row of a grid.
In this form there is some fields of type “combobox”, that I’m using autocomplete properties:

    xtype: 'combobox',
    store: 'Paciente',
    forceSelection: true,
    typeAhead: true,
    pageSize: 10,
    fieldLabel: 'Paciente',
    name: 'paciente_id',
    valueField: 'id',
    displayField: 'nome',
    allowBlank: false,
    afterLabelTextTpl: required

this is my store:

Ext.define('App.store.Paciente', {
  extend: 'Ext.data.Store',
  model: 'App.model.Paciente',
  pageSize: 10,
  proxy: {
      type: 'rest',
      format: 'json',
      url: 'pacientes',
      reader: {
          root: 'pacientes',
          totalProperty: 'totalCount'
      }
  }
});

The combo works, when using it. But when I select a line in the grid, all fields get filled, but not the combos.

gridSelectionChange: function(model, records) {
    if (records[0]) {
        this.getForm().load(records[0]);
    }
},

How can I get this combo filled correctly when the form is loaded?

Update 1: working code

I had to do this manually for each combobox. I thought that was an automatically way..

if (records[0]) {
        this.getForm().loadRecord(records[0]);

        //updating current value for combo paciente 
        this.getStore('Paciente').add({nome: records[0].get('nome'), id: records[0].get('id')});
        this.getCombopaciente().select(records[0].get('paciente_id'));

        //updating current value for combo XYZ...
    }

Answer 1

By default combo loads store only when expanding. In your case it has no data to display.
You can call store load method manualy or set autoload property in combo config.