Sencha Touch: [undefined] is not a function

Question

I'm trying to get element by class name with Sencha Touch

itemswipe: function(dataview, index, element, e) {
    console.log(element.select('.x-list-disclosure'));
}

but it returns this error:

TypeError: Result of expression 'element.select' [undefined] is not a function.

Here is the full code block

var list1 = new Ext.List({
    flex: 1,
    cls: 'list_simple',
    sorters: ['firstName', 'group'],
    itemTpl: '{firstName} {lastName}',
    grouped: true,
    groupTpl : [
        '<tpl for=".">',
            '<div class="x-list-group x-group-{id}">',
                '<h3 class="x-list-header"><div class="header">{group}</div></h3>',
                '<div class="x-list-group-items">',
                    '{items}',
                '</div>',
            '</div>',
        '</tpl>'
    ],
    onItemDisclosure: function(record, btn, index) {
        Ext.Msg.alert('Tap', 'Disclose more info for ' + record.get('firstName') + ' ' + record.get('lastName'), Ext.emptyFn);
    },
    listeners: {
        itemtap: function(dataview, index, element, e) {
            console.log('node is tapped');
        },
        itemswipe: function(dataview, index, element, e) {
            console.log(element.select('.x-list-disclosure'));
        }
    },
    store: store
});

(Added) This is the generated elements of {items}:

<div class="x-list-group-items">
    <div class="x-list-item x-item">
        <div class="x-list-item-body">Melvin Gilbert</div>
        <div class="x-list-disclosure"></div>
    </div>
    <div class="x-list-item x-item">
        <div class="x-list-item-body">Jeaffrey Gilbert</div>
        <div class="x-list-disclosure"></div>
    </div>
</div>

Any ideas?

Looks like your trying to get .x-list-disclosure but you do not have it anywhere in the code you are showing us. — Kevin Anthony Oppegaard Rose
It is auto-generated element. I get expected result if I do console.log(element). I wonder if the lib is broken, but I don't think so. — Jeaf Gilbert
what is the value of console.log(element); inside your itemswipe listener? — JamesHalsall
HtmlDivElement with .x-list-item class. I added the generated item elements in the question. — Jeaf Gilbert
Wrap your element variable with a call to Ext.fly and it will give you an Ext.Element representation of the dom element. The element variable is a DOM node rather than an Ext.Element instance. So it becomes Ext.fly(element).select('..') — Stuart

Stuart Stuart · Accepted Answer · 2011-11-22T16:00:10

Wrap your element variable with a call to Ext.fly and it will give you an Ext.Element representation of the dom element. The element variable is a DOM node rather than an Ext.Element instance. So it becomes Ext.fly(element).select('..')

Sencha Touch: [undefined] is not a function

1 Answers