PDA

View Full Version : Showing hidden component (fieldset)



Wolfie
4 Aug 2010, 3:45 AM
Hi all


I have this part of code :



AddRoutePanel = function(config)
{
var self = this;
config.title = 'Dodaj';

self.panel = config.panel;

this.radio_group = new Ext.form.RadioGroup({
columns: 1,
items : [{boxLabel: 'Wyszukaj tras?', name: 'rb-auto', inputValue: 1},
{boxLabel: 'Wytycz na mapie (wyrysuj)', name: 'rb-auto', inputValue: 2},
{boxLabel: 'Zapisz tras? historyczn?', name: 'rb-auto', inputValue: 3},
{boxLabel: 'Wczytaj z pliku', name: 'rb-auto', inputValue: 4}
]
});

this.radioFieldset = new Ext.form.FieldSet({
title: 'Nowa trasa wzorcowa',
items: [this.radio_group]
});

this.routePointsGridPanelStore = new Ext.data.ArrayStore({});

this.routePointsGridPanel = new Ext.grid.GridPanel({
store: this.routePointsGridPanelStore,
columns: [{id:'Id', header:'Id', dataIndex:'Id'},
{header: 'Grupa',width: 75,sortable: true,dataIndex: 'address'}]
});

this.routePanelFieldset = new Ext.form.FieldSet({
title : 'Punkty trasy',
items: [this.routePointsGridPanel],
hidden: true
});

this.radio_group.on('change', function(group, radio){
if(radio.inputValue == "1")
{
self.routePanelFieldset.show();
self.doLayout();
self.panel.doLayout();
} //else self.routePointsGridPanel.show();
});

//config.style = 'padding-left: 20px';
config.items = [this.radioFieldset, this.routePanelFieldset];
config.labelWidth = 10;
config.autoHeihgt = true;

AddRoutePanel.superclass.constructor.call(this, config);
};
Ext.extend(AddRoutePanel, Ext.Panel,{});


What i am trying to do is to show hidden fieldset (this.routePanelFieldset) which is item of AddRoutePanel extending Ext.Panel

I have radiogroup, and for tests when I am clicking on firts radio It should show routePanelFieldset.

I did it like this :



this.radio_group.on('change', function(group, radio){
if(radio.inputValue == "1")
{
self.routePanelFieldset.show();
self.doLayout();
self.panel.doLayout();
} //else self.routePointsGridPanel.show();
});


But nothing is happening, what I am doing wrong ?

Condor
4 Aug 2010, 4:02 AM
Are you sure it is not shown? I think it is shown, but since you didn't define any height or width for either the grid or the fieldset, the fieldset will be height:0.

Wolfie
4 Aug 2010, 4:52 AM
Unfortunately, I have added height to GridPanel as well as to Fieldset but it doesn not work, maybe because it is inside Panel which layout is set to accordion and this Panel is inside TabPabel...

But I think it should't have any influence...

Condor
4 Aug 2010, 4:57 AM
Are you sure you configured your layout so all components get sized? (e.g. autoHeihgt isn't valid).

Wolfie
5 Aug 2010, 2:29 AM
So should I add height parameter to all components in Panel? It's not very logical to me :-?

Condor
5 Aug 2010, 2:45 AM
Either a fixed height, autoHeight:true, or a height set by the container layout of the component.

Wolfie
5 Aug 2010, 3:03 AM
Panel which is in first post is in TabPanel.

I gave to this TabPanel height = 300 and than the fieldset is showing, but when I am giving autoHeihgt = true to TabPanel then the component isn't showing....I need autoHeight cause the height of the TabPanel will be changing depending of the elements inside....

Condor
5 Aug 2010, 3:27 AM
If you make the TabPanel autoHeight:true (watch your spelling!!!) then all components inside that don't have a height will also need to be configured with autoHeight:true.

Wolfie
5 Aug 2010, 4:41 AM
Now it's working, thanks for help :)