Get form filed by using reference

Question

I have a form as follows

this.stdForm  = new Ext.form.Panel(this.createStdForm());
this.stdForm.getForm().load({
     params: { action: 'load', id: 1234, dep: 'std' },
     success: this.formLoaded,
     scope: this
});

createStdForm: function () {    
    var flds = {
       items: [
           { fieldLabel: 'Roll Number', name: 'ROLL_NUMBER', xtype: 'displayfield' } }
       ]
    };

    var fldSet = {
       title: 'Student Information',
       xtype: 'panel',
       defaultType: 'fieldset',
       defaults: { autoHeight: true, baseCls: 'x-fieldset-noborder', reference:'RollNumber'},
       items: [flds]
    };

    return {
        layout: 'column',          
        border: false,
        defaults: {                           
           border: false
        },                        
        url: this.getUrl(),
        items: [
           col1
        ]
     };    
}

and on formloaded function, I am trying to get reference of roll number field

formLoaded:function (form, action) {
  form.getreferences('RollNumber') // not working
  form.lookupreference(); // not working
}

Can anybody tell me what I am doing wrong.

Answer 1

In your example - just add referenceHolder: true to the panel:

If true, this container will be marked as being a point in the hierarchy where references to items with a specified reference config will be held. The container will automatically become a referenceHolder if a controller is specified. See the introductory docs for Ext.container.Container for more information about references & reference holders.

Working example: https://fiddle.sencha.com/#fiddle/1d7t