Success! Looks like we've fixed this one. According to our records the fix was applied for TOUCH-4550 in a recent build.
  1. #1
    Sencha User
    Join Date
    Dec 2012
    Posts
    2
    Vote Rating
    1
    Agis is on a distinguished road

      1  

    Default Cannot destroy DataView holder from itemtap listener

    Cannot destroy DataView holder from itemtap listener


    REQUIRED INFORMATION




    Ext version tested:
    • Sencha Touch 2.2.1 + Sencha Cmd v3.1.2.342

    Browser versions tested against:
    • Chrome 27.0.1453.94 m

    Description:
    • I have a Panel with a DataView inside. If I destroy the Panel in the DataView's itemtap listener, I get the error: "Uncaught TypeError: Cannot call method 'getAt' of null". The problem has been isolated in the code snippet posted below.

    Steps to reproduce the problem:
    • Create a Panel
    • Create a DataView inside
    • Set a listener on the "itemtap" event
    • Have the listener destroy the panel
    • Build the app with Sencha Cmd v3.1.2.342 running sencha app build testing
    • Tap on one of the DataView's items

    The result that was expected:
    • The panel is destroyed without problems. This is the behavior I expected and observed in ST 2.0, which I am upgrading from.

    The result that occurs instead:
    • An error is thrown. I see "Uncaught TypeError: Cannot call method 'getAt' of null" in the console.

    Test Case:


    Code:
    // this bare-bones snippet demonstrates the problem, styling is irrelevant
    var panel = Ext.create('Ext.Panel', {
        width: 300,
        height: 600,
        layout: 'fit',
        
        items: [
            {
                xtype: 'dataview',
                store: {
                    fields: [ 'name', 'age' ],
                    data: [
                        { name: 'Tom', age: 26 },
                        { name: 'Jack', age: 23 },
                        { name: 'Rick', age: 24 },
                        { name: 'Gary', age: 25 }
                    ]
                },
                itemTpl: '{name} is {age} years old',
                listeners: {
                    itemtap: function(dataview, index, target, record) {
                        panel.destroy();
                    }
                }
            }
        ]
    });
    
    
    Ext.Viewport.add(panel);





    HELPFUL INFORMATION


    Debugging already done:
    • onItemTrigger is bound, by default, to the "itemtap" event.
    • After tapping on an item and destroying the panel, a second "itemtap" event is fired
    • The second "itemtap" event is routed to the onItemTrigger() method, which attempts to do this:
      Code:
      this.selectWithEvent(this.getStore().getAt(index));
      The getStore() call naturally returns null and the error message "Uncaught TypeError: Cannot call method 'getAt' of null" gets printed on the console.

    Additional CSS used:
    • only default ext-all.css

    Operating System:
    • Windows 7 Professional N

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,640
    Vote Rating
    898
    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


    Thanks for the report! I have opened a bug in our bug tracker.

  3. #3
    Sencha User
    Join Date
    Apr 2013
    Posts
    10
    Vote Rating
    0
    frayjusto is on a distinguished road

      0  

    Default Workaround

    Workaround


    What a great bug report!

    Apparently a fix is coming, but in the meantime, here's a workaround: dataview.js line 559:

    Code:
        // apply to the selection model to maintain visual UI cues
        onItemTrigger: function(me, index) {
            var store = me.getStore();
            if(store) {
                this.selectWithEvent(store.getAt(index));
            }
        },