Success! Looks like we've fixed this one. According to our records the fix was applied for EXTJS-6933 in 4.1.2.
  1. #1
    Sencha User
    Join Date
    Feb 2010
    Posts
    22
    Vote Rating
    1
    lager is on a distinguished road

      0  

    Default metachange event fire multiple times

    metachange event fire multiple times


    Ext version tested:

    Ext 4.1.0

    Browser versions tested against:
    • Chrome 20.0
    Description:
    • Metachange is fired multiple times (+1 for each load)
    Steps to reproduce the problem:
    • Create store
    • load multiple times
    • You will get one more metachange event each time you load
    The result that was expected:
    • One event
    Test Case:
    Code:
    Ext.define('MyModel', {
        extend : 'Ext.data.Model',
        fields : ['text']
    });
    
    
    var data = {data : [{text : 123}], metaData : {some : 'meta'}};
    
    
    var myStore = Ext.create('Ext.data.Store', {
        
        model : 'MyModel',
    
    
        proxy : {
            type : 'memory',
            reader : {
                type : 'json',
                root : 'data'
            }
        }
    
    
    });
    
    
    myStore.on('metachange', function() {
        console.log('EVENT');
    });
    
    
    myStore.getProxy().data = data;
    myStore.load();
    // Now run myStore.load again (and again) and see what happens.
    HELPFUL INFORMATIONDebugging already done:
    • Ext.data.proxy.Proxy setReader creates sequence to onMetaChange function. It happens every time onMetaChange runs.
    Operating System:
    • OS X

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,327
    Vote Rating
    850
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    This line is bad and causing it:

    Code:
    myStore.getProxy().data = data;
    Plus the Memory proxy you really don't need to load the proxy
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Ext JS Premium Member
    Join Date
    Dec 2011
    Posts
    23
    Vote Rating
    1
    paul_wang is on a distinguished road

      0  

    Default


    I'm seeing this as well. Was just about to create a bug when I saw this. This is for 4.1.1. Let me know if you prefer if I create another bug.

    Every time I press the refresh button I see more and more log message.

    Code:
            // testing for metachange event
            Ext.onReady(function() {
    
    
                var store = Ext.create('Ext.data.Store', {
                    fields: ['field_A', 'field_B'],
                    proxy: {
                        type: 'ajax',
                        url: 'testdata.html',
                        reader: {
                            type: 'json',
                            root: 'data'
                        }
                    }
                });
    
    
                store.on('metachange', function() {
                    Ext.log("store metachange.");
                });
    
    
                var grid = Ext.create('Ext.grid.Panel', {
                    width: 700,
                    height: 500,
                    title: 'Test Grid',
                    store: store,
                    disableSelection: true,
                    loadMask: true,
                    forceFit: true,
                    // grid columns
                    columns: [
                        {
                            text: "Column A",
                            dataIndex: "field_A"
                        },
                        {
                            text: "Column B",
                            dataIndex: "field_B"
                        }
                    ],
                    // paging bar on the bottom
                    bbar: Ext.create('Ext.PagingToolbar', {
                        store: store,
                        displayInfo: true,
                        displayMsg: 'Displaying data {0} - {1} of {2}',
                        emptyMsg: "No data to display"
                    }),
                    renderTo: Ext.getBody()
                });
    
    
                store.load();
            });
    And this is the content of testdata.html.

    Code:
    {
          "success": true,
          "metaData": {
                "firstmeta": "metavalueone",
                "secondmeta": "metavaluetwo"
          },
          "data": [
                {
                      "field_A": "first value for field A",
                      "field_B": "first value for BBB"
                },
                {
                      "field_A": "aaa",
                      "field_B": "bbb"
                },
                {
                      "field_A": "aaa third",
                      "field_B": "bbb third"
                }
          ]
    }

  4. #4
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    16,991
    Vote Rating
    649
    evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute

      0  

    Default


    I don't think this is a bug, perhaps the documentation should be clearer. The 'metachange' event doesn't actually check if the metadata changes at all, since it could encompass both any change to the field configuration or the column configuration. Rather, it just means "hey, the server replied with metadata, you can respond to it". It's not expected that you return the same metadata every time, because it will cause your grid to be reconfigured each time you load the store which is totally suboptimal.
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

  5. #5
    Ext JS Premium Member
    Join Date
    Dec 2011
    Posts
    23
    Vote Rating
    1
    paul_wang is on a distinguished road

      0  

    Default


    The bug is not that the event is firing but that you get one more metachange event each time.

    First time store loads I see one row printed in the console. I press paging toolbar's refresh button and I see two more rows printed in the console. I press it again and I get 3 more rows and on and on it goes. I think there's might be a problem in the Proxy where it's using Ext.Function.createSequence but I'm not sure.

    Description:
    • Metachange is fired multiple times (+1 for each load)

  6. #6
    Ext JS Premium Member
    Join Date
    Dec 2011
    Posts
    23
    Vote Rating
    1
    paul_wang is on a distinguished road

      0  

    Default


    I added logging to store's 'beforeload' event and this is what I see in my console after I refreshed 4 times. You'll notice for each store load you get one more metachange event.

    store beforeload event. ext-all-dev.js:11105
    store metachange. ext-all-dev.js:11105
    store beforeload event. ext-all-dev.js:11105
    store metachange. ext-all-dev.js:11105
    store metachange. ext-all-dev.js:11105
    store beforeload event. ext-all-dev.js:11105
    store metachange. ext-all-dev.js:11105
    store metachange. ext-all-dev.js:11105
    store metachange. ext-all-dev.js:11105
    store beforeload event. ext-all-dev.js:11105
    store metachange. ext-all-dev.js:11105
    store metachange. ext-all-dev.js:11105
    store metachange. ext-all-dev.js:11105
    store metachange. ext-all-dev.js:11105