Referencing some items each other

[attu]

Hi everyone!

I've got 2 items in a FormPanel. First one is a radiogroup, second one is an Extended TabPanel.

I'm trying to modify some properties of the TabPanel depending the value of the radiogroup.

I've been thinking about it and i've coded this:

var f = new Ext.FormPanel({
    ...
    items:[{
        ...
    },{
        xtype: 'radiogroup',
        hideLabel: true,
        itemCls: 'x-check-group-alt',
        vertical: true,
        name: 'ro',
        columns: 1,
        items:[{
            ...
        }]
    },{
        ...
    },{
        xtype: 'tabPanelFianzas',
        radio: f.getForm().findfield('ro')
    },{
        ...
    }]

And trying to handle the value of 'ro' in my extended tabPanelFianzas.

Is it anyway to do it? is it the correct way? I'm tring to avoid the use of Ext.getCmp().

f is undefined like that, and i've been trying with "this" and is window.document.

Thanks in advance!

[laurentParis]

Your form (f) is not rendered when your code trying affect f.getForm()... to property 'radio'

{
  xtype: 'tabPanelFianzas',
  getRadio: function () {
    var radio = Ext.getCmp('myFormId').getForm().findfield('ro');
    return function () {
      return radio;
    }
  }
} 

[attu]

Oh! Thanks! i get it.

Now, is there any way to change some properties of the extended TabPanel if i handle the radiogroup without changing the radiogroup code?

Thanks!!

[laurentParis]

{
  xtype: 'tabPanelFianzas',
  getRadio: function () {
    var radio = Ext.getCmp('myFormId').getForm().findfield('ro');
    return function () {
      return radio;
    }
  },
  listeners: {
    render: function (cmp) {
      var radio = cmp.getRadio();
      radio.on('change', function (radioGroup,radioChecked) {
        if(....) {
          cmp.hide(); // cmp is your tabPanelFianzas
        }
        else {
          cmp.show();
        }
      };
    }
  }
} 

but it will be more easiest to start with radiogroup

{
  xtype: 'radiogroup',
  hideLabel: true,
  itemCls: 'x-check-group-alt',
  vertical: true,
  name: 'ro',
  columns: 1,
  items:[{
    ...
  }],
  listeners: {
    change: function (radioGroup, radioChecked) {
      var tabpanel = Ext.getCmp('myTabPanelFianzas');
      if(....) {
        tabpanel.hide();
      }
      else {
        tabpanel.show();
      }
    }
  }
}
..
{
  xtype: 'tabPanelFianzas',
  id: 'myTabPanelFianzas'
} 

[attu]

Yeah! I'm really close to the solution!!

Thank you so much!!