Filling comboBox from returned response

[Mango_lier]

I have a form defined like this

usersDlg = function() {
    var user_name = new Ext.form.TextField({
        emptyText: "Please enter Name",
        fieldLabel: "Name",
        name: "user_name",
        allowBlank: false,
        maxLength: 100,
        anchor: "95%"
    });
    var user_security_level = new Ext.form.ComboBox({
        fieldLabel: "Security Level",
        name: "user_security_level",
        anchor: "95%",
        valueField:'userlevel_id',
        displayField:'userlevel_title',
        hiddenName:'user_security_level',
        editable:false,
        mode: 'local',
        triggerAction: 'all',
        store:new Ext.data.Store({
            reader : new Ext.data.JsonReader({
                root : 'user_security_level',
                id: 'userlevel_id'
            }, ["userlevel_id","userlevel_title"])
        })
    });

    this._form = new Ext.FormPanel({
        baseCls: 'x-plain',
        labelAlign: 'left',
        labelWidth: 80,
        bodyStyle:'padding:5px 5px 0;position:relative;',
        defaults: { bodyStyle: 'background-color: #CAD9EC;'},
        layoutConfig:{deferredRender:false},
        reader : new Ext.data.JsonReader({
            root : 'data',
            id: 'user_id'
        }, ["user_name","user_security_level"]),
        items: [user_name,user_security_level]
    });
}; 

I am loading data into the form like

this._form.load({method : 'GET', url:'users.php', params:{user_id:1}, waitMsg:'Loading...'}); 

The response returned from the server looks like following

{
    "success": true ,"totalrecords": 1 ,"pagesize": 1 ,"page": 1 ,
    "data": [{"user_id": 1,"user_name": "Mr Guest","user_security_level": 1}],
    "user_security_level":[    {"userlevel_id": 1,"userlevel_title": "Guest"},
                        {"userlevel_id": 2,"userlevel_title": "User"},
                        {"userlevel_id": 3,"userlevel_title": "Manager"},
                        {"userlevel_id": 4,"userlevel_title": "Admin"}]
} 

I would like to fill the comboBox on the form using the "user_security_level" node above. A little debugging reveals that the
"this._form.reader.jsonData" holds what I need. but how to fill the comboBox?

[Mango_lier]

Polite bump

[Condor]

Use:

this._form.getForm().load({
  ...
  success: function(form, action) {
    user_security_level.store.loadData(action.result);
  }
});

(needs extra code to make user_security_level accessible)

[Mango_lier]

Thanks Condor, I am loading the data like this.

this._form.on('actioncomplete', function(form, action){
    form.items.get(form.items.findIndex('name','user_security_level')).store.loadData(form.reader.jsonData);
}); 

The comboBox is populated with correct data but for first time, shown data is the value and not the display field. My guess is that it is because the comboBox datastore is getting initialized after the data in the form fields. What event I can trap to populate the comboBox before the form is filled in.

[Mango_lier]

I think this is the way to do it, correct me if I am wrong.

    this._form.form.setValues =
        this._form.form.setValues.createInterceptor(function(values) {
            this._form.form.findField('user_security_level').store.loadData(this._form.reader.jsonData);
        }, this);