View Full Version : [CLOSED] Stateful fieldset does not collapse / expand with default settings

16 Apr 2013, 10:17 AM

Ext version tested:

Ext 4.2.0 rev 663

Browser versions tested against:

Chrome 26

DOCTYPE tested against:



If you define a FieldSet with default settings for state recovery, collapse and expand wont work, because they are not calling the methods "expand()" and "collapse()" of the FieldSet. Instead, they are just setting the configuration on the object, which does nothing after the component is rendered

I understand that applyState should be overriden for complex operations, but because the default configuration for "stateEvents" is ['collapse', 'expand'], I think it is safe to say that users will imply that "collapse" and "expand" handlers will be implemented by default on applyState.

This behavior is probably happening in Panel and Window classes as well.

Steps to reproduce the problem:

Run the code below
Collapse / expand some fieldsets
Reload the page (to restore the state from the cookie)
Fieldsets won't be collapsed / expanded as you left them, before reloading the page.
Fieldsets configurations will be exactly as you left them when you reloaded the page (collapsed: true/false)

The result that was expected:

Fieldsets rendered collapsed and expanded as is defined by the state cookie.

The result that occurs instead:

Fieldsets rendered as they are defined by the javascript code, although they have the collapsed configuration as defined by the cookie.

Test Case:

Ext.state.Manager.setProvider(new Ext.state.CookieProvider());

Ext.create('Ext.container.Viewport', {
defaults: {
stateful: true,
collapsible: true,
collapsed: true
items: [{
xtype: 'fieldset',
title: 'Test 1',
stateId: 'test1',
items: [{
xtype: 'textfield',
fieldLabel: 'Test 1'
xtype: 'fieldset',
title: 'Test 2',
stateId: 'test2',
items: [{
xtype: 'textfield',
fieldLabel: 'Test 2'


Screenshot or Video:

No screenshot attached

Debugging already done:

See fix below.

Possible fix:

FieldSet::applyState(state) only sets the configuration of the component, something like: Ext.apply(me.initialConfig, state);
Instead, it should check if state.collapsed === true and do me.collapse() or me.expand().

Additional CSS used:


Operating System:

Windows 8 Pro 64 bits

16 Apr 2013, 11:21 AM
Thanks for the report! I have opened a bug in our bug tracker.

17 Aug 2017, 5:23 AM
The problem still occurs in ExtJS 6.2.

A workaround is posted in another thread (defining `applyState` function is required to get it working):