Results 1 to 8 of 8

Thread: Stateful Components ignore StateEvents

    Wait! Looks like we don't have enough information to add this to bug database. Please follow this template bug format.
  1. #1
    Sencha Premium Member
    Join Date
    Jul 2014
    Location
    Freiburg, Germany
    Posts
    165

    Default Stateful Components ignore StateEvents

    Stateful Components should trigger their State Change Event only for those events, which are listed within their stateEvents config property, but they trigger it on every event.

    How to reproduce:

    Fiddle is configured that the grid is stateful and listens on the following events:
    Code:
    stateEvents: [
            'columnhide',
            'columshow'
    ]
    A state event logs 'getState' to the console.

    - goto: https://fiddle.sencha.com/#fiddle/g2a
    - open console
    - resize the grid window / resize a column / change the sorting of a column / maximize the grid
    - ^ all those Events trigger a getState, but the stateEvents should only listen on columnhide and columnshow




    Tested with: Chrome/Firefox and Ext JS 5.1.0.107

  2. #2
    Sencha Premium User evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    19,255

    Default

    These are added on by the grid/component themselves:

    Code:
    // From Component
    me.addStateEvents('resize');
    // From panel.Table
    me.addStateEvents(['columnresize', 'columnmove', 'columnhide', 'columnshow', 'sortchange', 'filterchange', 'groupchange']);
    Why do you say this is a bug?
    Twitter - @evantrimboli
    Former Sencha framework engineer, available for consulting.
    As of 2017-09-22 I am not employed by Sencha, all subsequent posts are my own and do not represent Sencha in any way.

  3. #3
    Sencha Premium Member
    Join Date
    Jul 2014
    Location
    Freiburg, Germany
    Posts
    165

    Default

    Hi Evant,

    hm ok, didn't know that the grid actually adds its own state events.

    I have read the documentation from the grid.Panel as follows:
    "An array of events that, when fired, should trigger this object to save its state. Defaults to none."

    I have assumed that I have to explicit define the events for each component, therefor I was a bit confused that any event triggered the state change event.

    Does this mean that I have to delete the stateEvents array in the constructor of my grid, such that only the events which are defined by me are triggering the state event?

    Thanks & regards,

  4. #4
    Sencha User
    Join Date
    Nov 2014
    Posts
    4

    Default

    If the stateEvents are hardcoded inside the initComponent function of Ext.panel.Table, what can we use the stateEvents config for ?

    What if I only want to save grid state on columnmove, right now I can't.

    It's not a bug, but it's just not usable

  5. #5
    Sencha Premium Member
    Join Date
    Jul 2014
    Location
    Freiburg, Germany
    Posts
    165

    Default

    I have the same problem as PBMF.
    I only want to save the grid state on columnadd/remove, all other events are not relevant for me.

    Maybe we can create a workaround: Is there a possibility to know in the getState method, which event triggered the event?Regards,

  6. #6
    Sencha Premium Member
    Join Date
    Sep 2014
    Location
    Graz
    Posts
    21

    Default

    +1 for that, we have a combo and want to only save the state on collapse, we don't need a ajax request for every change event. there should be a setting to disable the default state events.

  7. #7

    Default

    Any solution for this issue ? How can we restrict this state save for only certain columns ? Even if it is with extjs 6 also fine for me

  8. #8
    Sencha Premium Member
    Join Date
    Sep 2014
    Location
    Germany Saxony
    Posts
    30

    Default

    The problem is not solved with Ext 6+ yet!
    But there is a way to prevent these events from being added.

    The function "addStateEvents" uses the object "stateEventsByName" to check if it has already been added.
    If we simply add this parameter to our component and fill it with the events, they will not be added during initialization.

    Code:
        addStateEvents: function(events) {
            var me = this,
                i, event, stateEventsByName, eventArray;
            if (me.stateful && me.getStateId()) {
                eventArray = (typeof events === 'string') ? arguments : events;
                stateEventsByName = me.stateEventsByName || (me.stateEventsByName = {});
                for (i = eventArray.length; i--; ) {
                    event = eventArray[i];
                    if (event && !stateEventsByName[event]) {
                        stateEventsByName[event] = 1;
                        me.on(event, me.onStateChange, me);
                    }
                }
            }
        }
    Example:
    Code:
        stateEventsByName:{
            'expand': 1,
            'collapse': 1
        },

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •